Web APIから受け取ったJSONからグラフを作成しようとしています。日付の代わりにティックナンバーを表示するハイチャート
リファクタリングを開始することにしました。 しばらくして、私はxAxisに日付が表示されなくなったことに気付きましたが、代わりにダニを表示しているようです。 私はJavaScriptで非常に慣れていないし、ハイチャートではそれ以上のことがあるので、間違いを見つけられない。
High Charts showing ticks. http://mortentoudahl.dk/images/highchartsBug.png
私はオプションオブジェクトを作成し、インスタンス化時にhighchartsに渡し、ここで見つけるの指示に従ってたんでした変更: http://www.highcharts.com/docs/getting-started/how-to-set-options 私はそのリンクの最後のコードブロックに私のコードを比較するとオプションオブジェクトを除いて、同じであるように見えます。
var pm10 = [];
var pm25 = [];
var options = {
chart: {
zoomType: 'x',
renderTo: 'container'
},
title: {
text: "Compounds in the air at HCAB"
},
subtitle: {
text: document.ontouchstart === undefined ? 'Click and drag in the plot area to zoom in' : "Pinch the chart to zoom in"
},
xAxix: {
type: 'datetime'
},
yAxis: {
title: {
text: 'µg/m³'
}
},
series: [{
name: 'Particles less than 2.5 µm',
data: pm25,
pointStart: Date.UTC(2016, 5, 8),
pointInterval: 86400 * 1000 // One day
}, {
name: 'Particles less than 10 µm',
data: pm10,
pointStart: Date.UTC(2016, 5, 8),
pointInterval: 86400 * 1000 // One day
}]
};
function ReverseAndSetArrays(data) {
$.each(data.reverse(), function(key, value) {
if ("PM10b" in value) {
pm10.push(value["PM10b"]);
};
if (!("PM10b" in value)) {
pm10.push(null);
};
if ("PM25b" in value) {
pm25.push(value["PM25b"]);
};
if (!("PM25b" in value)) {
pm25.push(null);
};
});
};
var url = "super secret url";
$.getJSON(url, function(data) {
ReverseAndSetArrays(data);
var chart = new Highcharts.Chart(options);
});
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="//code.highcharts.com/highcharts.js"></script>
<div id="container"></div>
、 xAxixではありません。 –