PowerCharts - CandleStick Charts Attributes
Created using FusionCharts Suite XT - www.fusioncharts.com
by FusionCharts
HTML
<script src="https://cdn.fusioncharts.com/fusioncharts/latest/fusioncharts.js"></script>
<script src="https://cdn.fusioncharts.com/fusioncharts/latest/themes/fusioncharts.theme.fusion.js"></script>
<!-- Candle Stick chart from PowerCharts.
This sample plots stock prices of Harry's Supertmart(stock name HRYS) for the last 2 months on a daily time period in CandleStick chart.
A candlestick chart is a style of bar-chart used primarily to describe price movements of a security, derivative, or currency for a designated span of time.
-->
<div id="chart-container">FusionCharts will render here</div>
JavaScript
FusionCharts.ready(function() {
var stockChart = new FusionCharts({
type: 'candlestick',
renderAt: 'chart-container',
id: 'myChart',
width: '700',
height: '400',
dataFormat: 'json',
dataSource: {
"chart": {
"theme": "fusion",
"caption": "Daily Stock Price HRYS",
"subCaption": "Last 2 months",
"numberprefix": "$",
"vNumberPrefix": " ",
"pyaxisname": "Price",
"vyaxisname": "Volume (In Millions)",
"toolTipColor": "#ffffff",
"toolTipBorderThickness": "0",
"toolTipBgColor": "#000000",
"toolTipBgAlpha": "80",
"toolTipBorderRadius": "2",
"toolTipPadding": "5"
},
"categories": [{
"category": [{
"label": "2 month ago",
"x": "1"
},
{
"label": "1 month ago",
"x": "31"
},
{
"label": "Today",
"x": "60"
}
]
}],
"dataset": [{
"data": [{
"open": "18.74",
"high": "19.16",
"low": "18.67 ",
"close": "18.99",
"x": "1",
"volume": "4991285"
},
{
"open": "18.74",
"high": "19.06",
"low": "18.54",
"close": "18.82",
"x": "2",
"volume": "3615889"
},
{
"open": "19.21",
"high": "19.3",
"low": "18.59 ",
"close": "18.65",
"x": "3",
"volume": "4749586"
},
{
"open": "19.85",
"high": "19.86",
"low": "19.12",
"close": "19.4",
"x": "4",
"volume": "4366740"
},
{
"open": "20.19",
"high": "20.21",
"low": "19.57",
"close": "19.92",
"x": "5",
"volume": "3982709"
...