Отображение MoM в старших чартах за неравные месяцы - PullRequest
2 голосов
/ 27 апреля 2020

Мне нужно сравнить этот месяц с предыдущим месяцем. Я сталкиваюсь с неприятностями, потому что продолжительность месяца неравномерна. Для каждого дня в этом месяце я хочу отобразить значение того же дня в прошлом месяце (01.Jan = 01.Feb) и наоборот (31.Jan = конец месяца или 29Feb)

Для пример: за январь 2020 года я хочу отобразить 31 день

с 2020 года февраль. Я хочу отобразить 29 дней, но сохранить линию неподвижной, даже если даты этого типа для февраля не существуют.

Таким образом, всплывающая подсказка будет выглядеть примерно так:

  • 29.02.2020 = значение за последний месяц (29.01), значение этого месяца (29.02)
  • 30.02.2020 = должно отображаться как «30-е значение» или что-то подобное; Значение прошлого месяца (30.01), значение этого месяца (29.02)
  • 31.02.2020 = должно отображаться как «31-е значение» или что-то подобное; Значение прошлого месяца (31.01), значение этого месяца (29.02)

var test_data_last_month = [[Date.UT C (2020,0,1), 0], [Date.UT C (2020,0,2), 155752], [Date.UT C (2020,0,3), 245224], [Date.UT C (2020,0,4), 313143], [Дата .UT * * тысяча тридцать шесть (2020,0,5), 454540], [Date.UT C (2020,0,6), 715791], [Date.UT C (2020,0,7), 715791 ], [Date.UT * * тысяча тридцать-девять (2020,0,8), 715791], [Date.UT C (2020,0,9), 988655], [Date.UT C (2020,0, 10), 1026435], [Date.UT * * тысяча сорок два (2020,0,11), 1332754], [Date.UT C (2020,0,12), 1567388], [Date.UT C ( 2020,0,13), 1940597], [Date.UT C (2020,0,14), 1940597], [Date.UT * 1 046 * (2020,0,15), 1940597], [Date.UT C (2020,0,16), 2081828], [Date.UT * +1048 * (2020,0,17), 2213635], [Date.UT C (2020,0,18), 2255751], [Date.UT C (2020,0,19), 2395119], [Date.UT C (2020,0,20), 2876209], [Date.UT C (2020,0,21) , 2876209], [Date.UT * * тысяча пятьдесят три (2020,0,22), 2876209], [Date.UT C (2020,0,23), 2988469], [Date.UT C (2020, 0,24), 3201548], [Date.UT * * тысяча пятьдесят шесть (2020,0,25), 3260514], [Date.UT C (2020,0,26), 3581301], [Date.UT C (2 020,0,27), 3817162], [Date.UT C (2020,0,28), 3817162], [Date.UT C (2020,0,29), 3817162], [ Date.UT C (2020,0,30), 4195778], [Date.UT C (2020,0,31), 4593995]]

var test_data_this_month = [[Date .UT * * тысяча шестьдесят три (2020,1,1), 76095], [Date.UT C (2020,1,2), 83687], [Date.UT C (2020,1,3), 320969 ], [Date.UT C (2020,1,4), 320969], [Date.UT C (2020,1,5), 320969], [Date.UT C (2020,1, 6), 501 655], [Date.UT C (2020,1,7), 631921], [Date.UT C (2020,1,8), 691171], [Date.UT C ( 2020,1,9), 805063], [Date.UT C (2020,1,10), 805063], [Date.UT * * тысячу семьдесят-три (2020,1,11), 805063], [Date.UT * * тысяча семьдесят четыре (2020,1,12), 805063], [Date.UT C (2020,1,13), 1043119], [Date.UT C (2020,1,14), 1311065], [Date.UT C (2020,1,15), 1400422], [Date.UT C (2020,1,16), 1778001], [Date.UT C (2020,1,17) , 2084701], [Date.UT C (2020,1,18), 2084701], [Date.UT C (2020,1,19), 2084701], [Date.UT C (2020, 1,20), 2139867], [Date.UT C (2020,1,21), 2501355], [Date.UT * 1 084 * (2020,1,22), 2546408], [Date.UT C (2020,1,23), 0], [Date.UT * 108 6 * (2020,1,24), 0], [Date.UT C (2020,1,25), 0], [Date.UT C (2020,1,26), 0], [ Date.UT * * тысяча восемьдесят-девять (2020,1,27), 0], [Date.UT C (2020,1,28), 0], [Date.UT * * один тысяча девяносто один (2020,1, 29), 0]]

два месяца, разделенные два месяца на одном графике

Я сводил меня с ума из-за Эта проблема. Любая помощь очень ценится.

1 Ответ

1 голос
/ 27 апреля 2020

Вы можете установить x как последовательные значения, увеличивающиеся на 1 (поведение по умолчанию), и сохранить дату как пользовательское свойство. Чтобы показать значения во всплывающей подсказке так, как вы хотите, используйте функцию tooltip.formatter:

tooltip: {
  shared: true,
  formatter: function() {
    var points = this.points,
      series = points[0].series.chart.series,
      point,
      i = 0,
      str = '';

    for (; i < series.length; i++) {
      if (points[i]) {
        point = points[i].point;

      } else {
        point = series[i].points[series[i].points.length - 1];
      }

      str += '<span style="color:' + point.color + '">●</span> ' +
        point.series.name + ' - ' + Highcharts.dateFormat('%e. %b', point.customDate) +
        ': <b>' + point.y + '</b><br/>'
    }

    return str;
  }
},
xAxis: {
  tickPositions: [1, 11, 21, 31]
},
plotOptions: {
  series: {
    keys: ['customDate', 'y'],
    pointStart: 1
  }
},

Демо-версия: http://jsfiddle.net/BlackLabel/6m4e8x0y/4986/

Справочник по API:

https://api.highcharts.com/highcharts/tooltip.formatter

https://api.highcharts.com/highcharts/plotOptions.series.pointStart

https://api.highcharts.com/highcharts/plotOptions.series.keys

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...