Данные Highstock не отображаются при настройке xAxis min и max

Question

Я не могу установить xAxis min и max без прикручивания данных.Я попытался использовать plotOptions и установить pointStart: Date.UTC(2016, 3, 1), но делал это с данными.Ряд заканчивается в крайнем правом углу и не загружается должным образом.

Можно ли установить минимальное и максимальное значения и заставить данные подчиняться тому, что установлено?Он загружается правильно, когда я не установил min и max.Мне нужно, чтобы он начинался в апреле 2016 года и заканчивался в апреле 2018 года галочкой каждый месяц.

Fiddle: https://jsfiddle.net/omaraziz/h5jsk7a3/5/

Вот почти рабочая версия, для которой нужны только даты xAxis игалочка (данные не совсем совпадают, но точно такая же настройка json:

Данные поступают из файла JSON (данные.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>