Несколько рядов в highstocks

#highcharts #series

#высокие диаграммы #Серии

Вопрос:

 trade = [
[1597622400000, 0.5542]
[1597622400000, 0.3899]
[1597622400000, 0.2109]
[1597622400000, 0.1645],

[1597708800000, 0.5124]
[1597708800000, 0.3321]
[1597708800000, 0.2111]
[1597708800000, 0.1837],

[1597795200000, 0.6635]
[1597795200000, 0.3956]
[1597795200000, 0.2322]
[1597795200000, 0.3455]
]
  

Я хочу создать диаграмму высокого уровня для данных этого формата. Мне нужно создать четыре ряда для данных [i] [0], данных [i] [1], данных [i] [2], данных [i] [3] (мне нужно отображать 4 точки каждый день.) Я могу воссоздать данные как [[1597622400000, [0.5542, 0.3899, 0.2109, 0.1645] , [1597708800000, [0.5124, 0.3321, 0.2111, 0.1837], [1597795200000, [0.6635, 0.3956, 0.2322, 0.3455]] если требуется.

     series: [{
        name: 'trade fall,        
        data: trade, 
        dataGrouping: {
        forced: true,
        approximation: 'sum',
        units: [[groupingUnit, [1]]]
                    }
            }],
  

Есть идеи о том, как я могу построить это? или какие-либо ссылки на соответствующую скрипку JS?

Пожалуйста, поделитесь любыми идеями о том, как я могу отформатировать данные или какие-либо изменения в ряду. Я могу попробовать воссоздать данные, как предложено. Основная цель состоит в том, чтобы каждый день составлять график 4 точек.

Ответ №1:

Будет здорово, если вы сможете воссоздавать свои данные и сохранять каждый день в одном массиве, как здесь:

 var trade = [
  [
    [1597622400000, 0.5542],
    [1597622400000, 0.3899],
    [1597622400000, 0.2109],
    [1597622400000, 0.1645],

  ],
  [
    [1597708800000, 0.5124],
    [1597708800000, 0.3321],
    [1597708800000, 0.2111],
    [1597708800000, 0.1837],
  ],
  [
    [1597795200000, 0.6635],
    [1597795200000, 0.3956],
    [1597795200000, 0.2322],
    [1597795200000, 0.3455],
  ]
];
  

Затем вы можете легко добавить свои данные в диаграмму:https://jsfiddle.net/BlackLabel/obahzwL3 /

 var data1 = trade.map(d => d[0]),
  data2 = trade.map(d => d[1]),
  data3 = trade.map(d => d[2]),
  data4 = trade.map(d => d[3]);


// Create the chart
Highcharts.stockChart('container', {

  series: [{
    data: data1
  }, {
    data: data2
  }, {
    data: data3
  }, {
    data: data4
  }]
});
  

Комментарии:

1. Привет, Себастьян, спасибо за твое предложение. Но что, если количество точек является динамическим. В этом случае я могу построить график для 4 точек. Но в некоторых случаях может быть 3 точки, 5 точек и даже 7 точек. Как обрабатывать подобные случаи?

2. Ваше требование было совершенно другим — (I need to plot 4 points each day.) . В случае неизвестного количества точек и серий вам нужно будет реализовать некоторую логику, которая определит, сколько точек в день, затем переберет это количество и создаст данные серии для каждого дня. jsfiddle.net/BlackLabel/tkvd3g1x