Display border around candlestick graph items
HTML
<script type="text/javascript" src="http://www.amcharts.com/lib/3/amcharts.js"></script>
<script type="text/javascript" src="http://www.amcharts.com/lib/3/serial.js"></script>
<script type="text/javascript" src="http://www.amcharts.com/lib/3/themes/none.js"></script>
<script type="text/javascript" src="http://www.amcharts.com/lib/3/amstock.js"></script>
<div id="chartdiv"></div>
CSS
#chartdiv {
width : 100%;
height : 500px;
}
JavaScript
var chartData = [];
generateChartData();
function generateChartData() {
var firstDate = new Date();
firstDate.setHours(0, 0, 0, 0);
firstDate.setDate(firstDate.getDate() - 2000);
for (var i = 0; i < 2000; i++) {
var newDate = new Date(firstDate);
newDate.setDate(newDate.getDate() + i);
var open = Math.round(Math.random() * (30) + 100);
var close = open + Math.round(Math.random() * (15) - Math.random() * 10);
var low;
if (open < close) {
low = open - Math.round(Math.random() * 5);
} else {
low = close - Math.round(Math.random() * 5);
}
var high;
if (open < close) {
high = close + Math.round(Math.random() * 5);
} else {
high = open + Math.round(Math.random() * 5);
}
var volume = Math.round(Math.random() * (1000 + i)) + 100 + i;
var value = Math.round(Math.random() * (30) + 100);
chartData[i] = ({
date: newDate,
open: open,
close: close,
high: high,
low: low,
volume: volume//,
//value: value
});
}
}
var dataSet = new AmCharts.DataSet();
dataSet.dataProvider = chartData;
dataSet.fieldMappings = [
{ fromField: "date", toField: "date" },
{ fromField: "open", toField: "open" },
{ fromField: "close", toField: "close" },
{ fromField: "high", toField: "high" },
{ fromField: "low", toField: "low" },
{ fromField: "volume", toField: "volume"}];
dataSet.categoryField = "date";
var chart = new AmCharts.AmStockChart();
chart.type = "candlestick";//this.get_radComboBoxChartType();
//chart.theme = "none";
//chart.pathToImages = "../amcharts/images/";
//this.chart.color = "#ffff0f";
//this.chart.dataDateFormat = "YYYY-MM-DD";
//this.chart.valueAxes = [{ position: "left" }];
chart.selectedBackgroundAlpha = 1;
...