Learning Highcharts. Whether you’re a novice or an advanced web developer, this practical tutorial will enable you to produce stunning interactive charts using Highcharts. With a foreword by the creator, it’s the only guide you’ll need to get started - Ebook - Highsoft Solutions AS, Joe Kuan - Modern learning platform

E-book details

Log in, If you're interested in the contents of the item.

Learning Highcharts. Whether you’re a novice or an advanced web developer, this practical tutorial will enable you to produce stunning interactive charts using Highcharts. With a foreword by the creator, it’s the only guide you’ll need to get started

Highsoft Solutions AS, Joe Kuan

Ebook

Highcharts is a popular web charting software that produces stunning and smooth animated JavaScript and HTML5 SVG graphs. It is among the leading web charting software in the market and has been used in many different sectors ó from financial to social websites. Although it is built on top of jQuery, it is so simple to construct that you need little programming skill to create a simple web chart. Highcharts works on all modern browsers and is solely based on native browser technologies and doesn't require client side plugins like Flash or Java.Learning Highcharts is a comprehensive tutorial with clear and practical examples. This book follows a step by step approach towards making artistic, presentable, or professional style charts and other types of charts that you won't find elsewhere. It also shows you how to integrate Highcharts with other popular frameworks, such as jQuery, jQuery Mobile, and ExtJS and even how to run it on the server side.The book starts off with an introduction to Highcharts and demonstrates usage of its rich set of options. This is followed by an introduction to each type of basic chart, beginning with simple illustrations and ending with more artistic and productive additions to the charts. The book then guides you how to use the Highcharts API and events handling which are important to build interactive applications. It then goes on to show you how to apply Highcharts onto a popular AJAX Framework or even jQuery, jQuery Mobile and Ext JS. Finally the book shows readers how to set up Highcharts running on server side. Learning Highcharts aims to teach you everything you need to know about Highcharts, and take the advanced leap from Flash to JavaScript, with this extremely productive and effective Charting software available, thus helping you build basic charts and even multiple series and axes charts. The book also shows you the flexibility of Highcharts and how to create other special charts. The programming side of APIs and event handling will benefit the readers in building advanced web applications with Highcharts. The book also guides readers on how to integrate Highcharts with popular frameworks such as jQuery Mobile and Ext JS. By the end of the book, you should be able to use Highcharts to suit your web page or application needs.

Learning Highcharts
- Table of Contents
- Learning Highcharts
- Credits
- Foreword
- About the Author
- About the Reviewers
- www.PacktPub.com
  - Support files, eBooks, discount offers and more
    - Why Subscribe?
    - Free Access for Packt account holders
- Preface
  - What this book covers
  - What you need for this book
  - Who this book is for
  - Conventions
  - Reader feedback
  - Customer support
    - Downloading the example code
    - Errata
    - Piracy
    - Questions
- 1. Web Charts
  - A short history of web charting
    - HTML image map (server-side technology)
    - Java applet (client side) and servlet (server side)
    - Adobe Shockwave Flash (client side)
  - The uprising of JavaScript and HTML5
    - HTML5 (SVG and canvas)
      - SVG (Scalable Vector Graphics)
      - Canvas
  - JavaScript charts on the market
    - jqPlot
    - amCharts
    - Ext JS 4 Charts
    - YUI 3 Charts
    - FusionCharts
    - JS Charts
    - Flot and Flotr
  - Why Highcharts?
    - Highcharts and JavaScript frameworks
    - Presentation
    - License
    - Simple API model
    - Documentations
    - Openness (feature request with user voice)
  - Highcharts a quick tutorial
    - Directories structure
  - Summary
- 2. Highcharts Configurations
  - Configuration structure
  - Understanding Highcharts layouts
    - Chart margins and spacings
    - Chart label properties
      - Title and subtitle alignments
      - Legend alignment
      - Axis title alignment
      - Credits alignment
    - Experimenting with the automatic layout
    - Experimenting with the fixed layout
  - Framing the chart with axes
    - Accessing the axis data type
    - Adjusting intervals and background
    - Using plot lines and plot bands
    - Extending to multiple axes
  - Revisiting the series configuration
  - Exploring PlotOptions
  - Styling the tooltips
    - Formatting the tooltips in HTML
    - Using the callback handler
    - Applying a multiple series tooltip
  - Animating charts
  - Expanding colors with gradients
  - Summary
- 3. Line, Area, and Scatter Charts
  - Introducing line charts
    - Extending to multiple series line charts
  - Sketching an area chart
  - Mixing line and area series
    - Simulating a projection chart
    - Contrasting spline with step line
    - Extending to a stacked area chart
    - Plotting charts with missing data
  - Combining scatter and area series
    - Polishing a chart with an artistic style
  - Summary
- 4. Bar and Column Charts
  - Introducing column charts
    - Overlapped column chart
    - Stacking and grouping a column chart
      - Mixing the stacked and single columns
      - Comparing the columns in stacked percentages
    - Adjusting column colors and data labels
  - Introducing bar charts
    - Giving the bar chart a simpler look
  - Constructing a mirror chart
    - Extending to a stacked mirror chart
  - Converting a single bar chart into a horizontal gauge chart
  - Sticking the charts together
  - Summary
- 5. Pie Charts
  - Understanding the relationship of chart, pie, and series
  - Plotting simple pie charts single series
    - Configuring the pie with sliced off sections
    - Applying a legend to a pie chart
  - Plotting multiple pies in a chart multiple series
  - Preparing a donut chart multiple series
  - Building a chart with multiple series types
  - Summary
- 6. Gauge, Polar, and Range Charts
  - Loading gauge, polar, and range charts
  - Plotting a speedometer gauge chart
    - Plotting a twin dials chart a Fiat 500 speedometer
    - Plotting a gauge chart pane
      - Setting pane backgrounds
      - Managing axes with different scales
      - Extending to multiple panes
    - Gauge series dial and pivot
    - Polishing the chart with fonts and colors
  - Converting a spline chart to a polar/radar chart
  - Plotting range charts with market index data
  - Using a radial gradient on a gauge chart
  - Summary
- 7. Highcharts APIs
  - Understanding the Highcharts class model
    - Highcharts constructor Highcharts.Chart
    - Navigating through Highcharts components
      - Using object hierarchy
      - Using the Chart.get method
      - Using the object hierarchy and Chart.get method
  - Using Highcharts APIs
    - Chart configurations
    - Getting data in Ajax and displaying new series with Chart.addSeries
    - Displaying multiple series with simultaneous Ajax calls
    - Extracting SVG data with Chart.getSVG
    - Selecting data points and adding plot lines
      - Using Axis.getExtremes and Axis.addPlotLine
      - Using Chart.getSelectedPoints and Chart.renderer methods
    - Exploring the series update
      - Continuous series update
    - Running the experiment
      - Applying a new set of data with Series.setData
      - Using Series.remove and Chart.addSeries to reinsert series with new data
      - Updating data points with Point.update
      - Removing and adding data points with Point.remove and Series.addPoint
      - Exploring SVG animations performance on browsers
    - Comparing Highcharts performance on large datasets
  - Summary
- 8. Highcharts Events
  - Introducing Highcharts events
  - Portfolio history example
    - Top-level chart
      - Constructing the series configuration for a top-level chart
      - Launching an Ajax query with the chart load event
      - Activating the user interface with the chart redraw event
      - Selecting and unselecting a data point with the point select and unselect events
      - Zooming the selected area with the chart selection event
    - Detail chart
      - Constructing the series configuration for the detail chart
      - Hovering over a data point with the mouseOver and mouseOut point events
      - Applying the chart click event
      - Changing the mouse cursor over plot lines with mouseover event
      - Setting up a plot line action with the click event
  - Stocks' growth chart example
    - Plot averaging series from displayed stocks series
    - Launching a dialog with the series click event
    - Launching a pie chart with the series checkboxClick event
    - Editing the pie chart's slice with the point click, update, and remove events
  - Summary
- 9. Highcharts and jQuery Mobile
  - A short introduction of jQuery Mobile
  - Understanding a mobile page structure
  - Understanding page initialization
  - Linking between mobile pages
  - Highcharts in touch screen environments
  - Integrating Highcharts and jQuery Mobile using an Olympic medals table application
    - Loading up the gold medals page
    - Detecting device properties
    - Plotting a Highcharts chart on mobile device
    - Switching graph options with the jQuery Mobile dialog box
    - Changing the graph presentation with a swipeleft motion event
    - Switching graph orientation with the orientationchange event
  - Drilling down for data with the point click event
  - Building a dynamic content dialog with the point click event
  - Applying the gesturechange (pinch actions) event to a pie chart
  - Summary
- 10. Highcharts and Ext JS
  - Short introduction to Sencha Ext JS
  - A quick tour of Ext JS components
    - Implementing and loading Ext JS code
    - Creating and accessing Ext JS components
    - Using layout and viewport
    - Panel
      - GridPanel
      - FormPanel
      - TabPanel
    - Window
    - Ajax
    - Store and JsonStore
      - Example of using JsonStore and GridPanel
  - The Highcharts extension
    - Step 1 removing some of the Highcharts options
    - Step 2 converting to Highcharts extension configuration
    - Step 3 constructing a series option by mapping the JsonStore data model
    - Step 4 creating the Highcharts extension
      - Passing series specific options in the Highcharts extension
    - Converting a data model into a Highcharts series
      - X-axis category data and y-axis numerical values
      - Numerical values for both x and y axes
      - Performing pre-processing from store data
    - Plotting pie charts
      - Plotting donut charts
    - Module APIs
      - addSeries
      - removeSerie and removeAllSeries
      - setTitle and setSubTitle
      - draw
    - Event handling and export modules
    - Extending the example with Highcharts
      - Displaying a context menu by clicking on a data point
  - A commercially Rich Internet Application with Highcharts AppQoS
  - Summary
- 11. Running Highcharts on the Server Side
  - Running Highcharts on the server side
  - Highcharts on the server side
    - Using Xvfb and web browsers (Unix solution)
      - Setting up a Highcharts export example on the client side
      - Installing Xvfb and a web browser
      - Starting up the Xvfb server
      - Applying server-side change
      - Running the server task
    - Rhino and Batik (Java solution)
    - Node.js/Node and Node-Highcharts (JavaScript solution)
      - Installing Node and modules
      - Setting up the Node server
      - Running the Node-Highcharts module
      - Starting the Node server and issuing a URL query
    - PhantomJS (headless webkit)
      - Preparing the series data script
      - Preparing the PhantomJS script
  - Comparison between the approaches
  - Summary
- Index

Title: Learning Highcharts. Whether you’re a novice or an advanced web developer, this practical tutorial will enable you to produce stunning interactive charts using Highcharts. With a foreword by the creator, it’s the only guide you’ll need to get started
Author: Highsoft Solutions AS, Joe Kuan
Original title: Learning Highcharts. Whether you’re a novice or an advanced web developer, this practical tutorial will enable you to produce stunning interactive charts using Highcharts. With a foreword by the creator, it’s the only guide you’ll need to get started.
ISBN: 9781849519090, 9781849519090
Date of issue: 2012-12-25
Format: Ebook
Item ID: e_3cf0
Publisher: Packt Publishing

select a language

Categories

E-book details