2015-01-08 5 views
4

Есть ли способ иметь 'datetime' для типа xAxis в основной серии, но затем, когда нажимается серия, на данный момент используются категории детализации развертки ?График высоких диаграмм с 'datetime' xAxis - использовать категории при развертке

В этом примере jsfiddle (http://jsfiddle.net/kadams/3e3xqv7e/) вы можете видеть, что, когда в качестве типа xAxis используется «category», данные детализации корректно используют сериальные серии «A», «B» и «C» на XAxis. Но когда тип xAxis изменяется на «datetime», а миллисекундное время используется для значения «x» вместо имени для основной серии, категории в развертке не показывают «A», «B» ', или' C '. Просто бессмысленные даты.

UPDATE для уточнения - я предпочел бы использовать тип «DATETIME» вместо «категории» типа со значениями отформатированы как даты, так как Highcharts выбросит ошибку-х слишком много тиков, когда ось х большая : http://www.highcharts.com/errors/19. Я приводил пример типа «категории» в приведенной ниже скрипте, чтобы продемонстрировать, что «A», «B», «C» действительно показывают, когда тип не «datetime».

$(function() { 
    $('#container').highcharts({ 
     chart: { 
      type: 'column', 
     }, 
     xAxis: { 
      type: 'category', 
      // type: 'datetime', 
      dateTimeLabelFormats: { 
       hour: '%l:%M %p' 
      } 
     }, 
     legend: { 
      enabled: false 
     }, 
     series: [{ 
      name: 'Total', 
      colorByPoint: true, 
      data: [{ 
       y: 8, 
       drilldown: 'Bob', 
       name: 'Bob', //used with 'category' xAxis type 
       x: 1420700400000 //used with 'datetime' xAxis type 
      }] 
     }], 
     drilldown: { 
      series: [{ 
       id: 'Bob', 
       name: 'Bob', 
       data: [{ 
        name: 'A', 
        y: 3 
       }, { 
        name: 'B', 
        y: 3 
       }, { 
        name: 'C', 
        y: 2 
       }] 
      }] 
     } 
    }); 
}); 
+0

К сожалению, вы не можете обновить типы осей между «Дрель вверх/вниз», так что вы можете онил уничтожить карту и создать новую. –

ответ

7

Я нашел решение для вас проблемных мужчин! Себастьян Бохан дал мне несколько идей. Вам нужно отделить xAxis и установить для каждого другого тип. Итак, здесь вы должны добавить свои категории как Highcharts way's.

xAxis: [{ 
     id: 0, 
     type: 'datetime' 
     }, 
     { 
     id: 1, 
     type: 'categories', 
     categories: data.categories 
     } 
    ] 

Затем вы должны добавить этот код в свою статью, чтобы связать его с вашей новой осью.

drilldown: { 
     series: [{ 
     name: "test", 
     id: "test", 
     xAxis: 1, // <--- your desired X axis ID 
     data: [ 
      [your data] 
     ] 
     }] 
    } 

Возможно, вы увидите небольшую разницу на нижней диаграмме, но все работает для меня.

Я надеюсь, что это помогает;)

+0

Это именно то, что нужно, спасибо! – chevin99

+0

Я рад, что это помогло вам! Спасибо Highcharts за то, что вы так гибки! – koyal13

4

Вы должны добавить к вашей xAxis:

labels: { 
     formatter: function() { 
       return Highcharts.dateFormat('%a %d %b', this.value); 
     } 
}, 

Отъезд fiddle.

+0

Спасибо за ответ, но серия детализации по-прежнему отображает даты на вашем примере при использовании типа «datetime» xAxis. Я уточнил свой вопрос для ясности. – chevin99

+0

Я неправильно понял ваш оригинальный вопрос. Мой плохой на этом. Я не знаю, можно ли использовать тип 'datetime' для типа parent и' category' для детей 'drilldown'. –

+0

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

Смежные вопросы