Highcharts - Пропустить дату в сериале

Итак, я извлекаю некоторые данные из базы данных и получаю временную метку UNIX и число. Допустим, N (число) было продано D (дата).

Дней не хватает, например, выходных. Мне нужно, чтобы он по-прежнему отображал день, но не требовал никаких данных. Это линейный график.

1 апреля 2010 г., 50 продано
2 апреля 2010 г., 53 продано
7 апреля 2010 г., 10 продано
(у меня более 1000 записей за несколько лет, поэтому я также добавлю масштаб)

Таким образом, на диаграмме все еще должны отображаться данные за 1-7 апреля, но нет данных за 3-6 апреля. (строка будет идти от 2 до 7).

Есть идеи, как это сделать?

Спасибо, Джош


person Josh    schedule 24.11.2010    source источник


Ответы (3)


посмотрите здесь: http://highcharts.com/ref/#series второй пример "данных ' имущество.

Вам просто нужно преобразовать дату mysql, преобразовать ее в отметку времени UNIX (UNIX_TIMESTAMP()), а затем умножить ее на 1000 (JS требует времени в микросекундах)...

person Josh    schedule 02.12.2010
comment
Я думаю, что это новая ссылка: api.highcharts.com/highcharts/series.line. данные с этим примером: jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/ - person Richard Czechowski; 01.06.2018

Масштабируйте ось x ваших данных при создании диаграммы, чтобы учитывать только те дни, когда у вас есть хотя бы одна продажа, и просто убедитесь, что ваша ось помечена разумно.

Это означало бы пошаговое выполнение всего набора данных и обеспечение того, чтобы он имел порядковые номера. Так что это может быть не очень эффективно и, безусловно, может быть полезно для предварительной обработки (еще один ключ в вашей базе данных для «дня распродажи» или чего-то еще).

person TZHX    schedule 24.11.2010

Вы можете отображать свои данные как обычные данные Y и использовать средство форматирования по оси x.

dates = ['April 1 2010', 'April 2 2010', 'April 7 2010'];
numSold = [50, 53, 10];

chart = new Highcharts.Chart({
    series: [{
        type: 'line',
        data: numSold
    }],
    xAxis: {
        labels: {
            formatter: function() {
                var dateStr = dates[this.value];
                return dateStr;
            }
        }
    }
});
person idrinkpabst    schedule 15.12.2010