Highstock Features
Compatible
It works in all modern browsers including the iPhone/iPad and Internet
Explorer from version 6.
Standard browsers use SVG for the graphics rendering. In legacy Internet
Explorer graphics are drawn using VML.
Free
for Non-commercial
Do you want to use Highstock for a personal website, a school site or a
non-profit organisation? Then you don't need the author's permission, just go on
and use Highstock. For commercial
websites and projects, see License
and Pricing.
Open
One of the key features of Highstock is that under any of the licenses, free or
not, you are allowed to download the source code and make your own edits. This
allows for personal modifications and a great flexibility.
Pure
JavaScript
Highstock is solely based on native browser technologies and doesn't require
client side plugins like Flash or Java. Furthermore you don't need to install
anything on your server. No PHP or
ASP.NET. Highstock needs only two JS files to run: The highstock.js core
and either the jQuery, MooTools or Prototype framework. One of these frameworks
is most likely already in use in your web
page.
Numerous
Chart Types
Highstock supports line, spline, area, areaspline, column, scatter, OHLC,
candlestick, flags, arearange, areasplinerange and columnrange chart types. Any
of these can be combined in one chart.
Simple
Configuration Syntax
Setting the Highstock configuration options requires no special programming
skills. The options are given in aJavaScript
object notation structure,
which is basically a set of keys and values connected by colons, separated by
commas and grouped by curly brackets.
Dynamic
Through a full API you can add, remove and modify series and points or modify
axes at any time after chart creation. Numerous events supply hooks for
programming agains the chart. In combination with jQuery, MooTools or
Prototype'sAjax
API, this opens for solutions like live charts constantly updating with
values from the server, user supplied data and more.
Range
selector
While navigating a large dataset, perhaps hourly values over several years, it
is important for the charting library to provide a quick way a to view a certain
time range. Highstock provides a range selector where the user can zoom in on
preselected time ranges like 1m, 1y or YTD, or manually add date ranges.
Scrollbar
and Navigator
Another, more visual way of navigating the data set is by dragging the
scrollbar, or dragging the edges of the Navigator window to the area of special
interst.
Event
marker flags
Through a specific series type called "flags", you can add event markers and
annotations directly related to an interesting are on the series. You can add
different visual styles to the markers to differentiate them, and you can add
them to the graph or the X axis.
Multiple
Axes
Sometimes you want to compare variables that are not the same scale. Highstock
lets you assign an y axis for each series. Each axis can be placed to the right
or left, or next to other axes. All options can be set individually, including
reversing, styling and position.
Tooltip
labels
On hovering the chart Highstock can display a tooltip text with information on
each point and series. The tooltip follows as the user moves the mouse over the
graph, making it easy and intuitive to read out the values from the chart.
Datetime
axis
Highstock is very intelligent about time values. With milliseconds axis units,
Highstock determines where to place the ticks so that they always mark the start
of the month or the week, midnight and midday, the full hour etc.
Data
grouping
If your data array consists of 100,000 points, it wouldn't be very effective for
the browser to calculate the translated position for each one and display a
graph with 100,000 points on what is often a 800px wide canvas. In comes the
Highstock data grouping facility, where the data is blazingly fast grouped into
optional groups like months or days, and displayed. When zooming in on smaller
ranges, the grouping is redone and you can inspect the full resolution data.
Export
and print
With the exporting module enabled, your users can export the chart to PNG, JPG,
PDF or SVG format at the click of a button, or print the chart directly from the
web page.
Zooming
and panning
In addition to controling the zooming and panning from the scroller and
navigator, you have the option to set mouse and finger zooming and panning.
External
Data Loading
Highstock takes the data in a JavaScript array, which can be defined in the
local configuration object, in a separate file or even on a different site.
Furthermore, the data can be handed over to Highstock in any form, and a
callback function used to parse the data into an array.