设置xAxis的最小值和最大值时，高库存数据未显示

Question

我无法设置xAxis的最小值和最大值，而无需处理数据。 我尝试使用plotOptions和设置pointStart: Date.UTC(2016, 3, 1)但这样做与数据有关。 该系列影片最终出现在最右边，无法正确加载。

是否可以设置最小值和最大值并使数据服从所设置的内容？ 当我未设置min和max时，它将正确加载。 我需要它从2016年4月开始到2018年4月结束，每个月都有一个滴答。

小提琴： https : //jsfiddle.net/omaraziz/h5jsk7a3/5/

这是一个几乎可以使用的版本，只需要xAxis日期和刻度（数据并不完全相同，但是json的设置完全相同：

数据来自JSON文件（data.json）：

{
   "(1)": [1,2,3,4,5],
   "(2)": [6,7,8,9,0]
   "(3)": [1,4,7,2,0]
}

设置选项：

var myChart = function() drawChart() {
     $("#container").highcharts("StockChart", {

            rangeSelector: {
                 enabled: false
            },

            xAxis: {
                 type: 'datetime',
                 tickInterval: (24 * 3600 * 1000) * 30, // every month
                 min: Date.UTC(2016, 3, 1),
                 max: Date.UTC(2018, 3, 4)
            },

           series: processedData, // from the data loaded below

    });

};

加载JSON：

processedData = [];

$(function () {
    $getJSON("data.json", function(data) {

        for(let value in data) {

            if(data.hasOwnProperty(value)) {
                processedData.push({
                   name: value,
                   data: data[value],
                })

        }
        myChart(); // after the data has loaded
   });
});

Answer 1

如果您每小时记录一次数据，希望使用以下两行代码可以解决您的问题：

pointStart:Date.UTC(2016, 3, 1),
pointInterval: 3600 * 1000

这是示例：

 var myChart = function drawChart() { $("#container").highcharts("StockChart", { rangeSelector: { enabled: false, }, xAxis: { type: 'datetime', ordinal: false, min: Date.UTC(2016, 3, 1), max: Date.UTC(2018, 3, 4) }, plotOptions:{ series:{ pointStart:Date.UTC(2016, 3, 1), pointInterval: 3600 * 1000 } }, series: processedData, }); }; const processedData = []; $(function () { $.getJSON("https://omaraziz.me/CC-chart/new-activity.json", function (data) { for(let value in data) { if(data.hasOwnProperty(value)) { processedData.push({ //pointStart: Date.UTC(2016, 3, 1), name: value, data: data[value], }) } } myChart(); }); }); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://code.highcharts.com/stock/highstock.src.js"></script> <div id="container"></div>