Highcharts Code Templates

by Ilya Ilyankou and Jack Dougherty, last updated March 21, 2017

While beginners appreciate the drag-and-drop chart tools and tutorials described earlier in this book, such as Google Sheets and Tableau Public, more advanced users may wish to customize their visualizations, add more complex data, and control exactly how and where their work appears on the web. A more powerful and relatively easy-to-learn solution is to use code templates built with Highcharts https://highcharts.com, an open-source library, which you can modify and host on GitHub, as described in this book.

Tool Review

  • Pros of working with Highcharts (http://highcharts.com):
  • Open-source code that is free for individuals, schools, and non-profits to use online or download
  • Easier for beginners to understand than more complex visualization code libraries
  • Cons:
  • For commercial use, you must purchase a license http://www.highcharts.com/products/highcharts
  • Must host your own code repositories to publish to the web (with a free service such as GitHub Pages)
Highcharts templates Best use and tutorial chapters
to come to come

Inside Highcharts code templates

The templates featured above vary from simple to complex, but all of them include three basic types of code: - HTML: to structure content on the web (example: index.html) - CSS, or Cascading Style Sheet: to shape how content appears on the web (example: style.css) - JavaScript: to create the chart and interactivity (example: script.js)

Also, these templates refer to other code elements: - library: link to online instructions to complete routine tasks (example: Highcharts) - data: content to appear in chart, typically in CSV format (example: data.csv) or pulled from Google Sheets

Learn more