Ярлыки оси гистограммы Echarts сверху и снизу

Я хотел бы отображать метки на верхней оси x и нижней оси x на моих гистограммах. Я пытаюсь выразить планку как диапазон между двумя противоположными значениями, например: Energetic vs Laid Back.

Кто-нибудь знает, как это сделать в echarts? В идеале это было бы примерно так, как показано ниже, но я не смог ничего найти:

option = {
  ...

  xAxis: [{
    type: "category",
    data-top: ["happy", "energetic", "early-bird"],
    data-bottom: ["melancholy", "laid-back", "night-owl"]
  }],

  ...
}

Я ожидал, что есть способ сделать это с помощью опции formatter, но я понятия не имею, как это сделать.

Ваша помощь очень ценится !!


formatter data-visualization echarts
person Adam    schedule 09.10.2020    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Вы можете использовать вторичную ось X для отображения меток вверху и внизу диаграммы.

Пожалуйста, обратитесь к варианту диаграммы ниже,

option = {
    xAxis: [{
        type: 'category',
        data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
    },
    {
        type: 'category',
        data: ['Mon Top', 'Tue Top', 'Wed Top', 'Thu Top', 
        'Fri Top', 'Sat Top', 'Sun Top']
    }],
    yAxis: {
        type: 'value'
    },
    series: [{
        data: [120, 200, 150, 80, 70, 110, 130],
        type: 'bar',
        showBackground: true,
        backgroundStyle: {
            color: 'rgba(220, 220, 220, 0.8)'
        }
    }]
};

График должен отображаться как,

введите описание изображения здесь

person Narayanan Ramanathan    schedule 10.10.2020