GoogleのチャートAPIは、X軸の値を変更する機能を備えたローソク足チャートをサポートしています。つまり、ここでは平日ですが、他の可能性もあります。
ただし、私が知る限り、このチャートAPIでは「芯」の線幅を変更できず、0が上になるように軸を反転することはできません(すべての負の値を使用するように切り替えない限り) )。
Highchartsには、よりフル機能のローソク足チャートとy軸を反転する機能がありますが、私が知る限り、x軸の値としてタイムスタンプを使用する必要があります。
Y軸が反転し、X軸にカスタムラベルを設定する機能と、場合によっては「芯」の厚さを調整するオプションを備えたHTML5ローソク足チャートを作成するためにどのツールを使用できますか?
Googleチャートの例
Highchartsの例
jqChartの例
(これはかなりめちゃくちゃです-ソースはこちらhttp://jsfiddle.net/FSEQP/)
<html>
<head>
</head>
<body>
<div id="jqChart" style="width: 800px; height: 550px;" />
</body>
</html>
function round(d) {
return Math.round(100 * d) / 100;
}
var data = [];
var date = new Date(2010, 0, 1);
var high = Math.random() * 40;
var close = high - Math.random();
var low = close - Math.random();
var open = (high - low) * Math.random() + low;
data.push([date, round(high), round(low), round(open), round(close)]);
for (var day = 2; day <= 12; day++) {
date = new Date(2010, 0, day);
high = open + Math.random();
close = high - Math.random();
low = close - Math.random();
var oldOpen = open;
open = (high - low) * Math.random() + low;
if (low > oldOpen) {
low = oldOpen;
}
data.push([date, round(high), round(low), round(open), round(close)]);
}
$(document).ready(function () {
$('#jqChart').jqChart({
title: { text: 'Candlestick Chart' },
legend: { visible: false },
// labelsOptions : { visible: false },
axes: [
{
type: 'linear',
location: 'left',
reversed: true
},
{
type: 'category',
location: 'bottom',
categories: [
'Category 1', 'Category 2', 'Category 3',
'Category 4', 'Category 5', 'Category 6',
'Category 7', 'Category 8', 'Category 9',
'Category 10', 'Category 11', 'Category 12'
],
labels: {
font: '12px sans-serif',
angle: -90,
}
}
],
series: [
{
type: 'column',
data: data
}
]
});
});