Question

我有一个绘制有4个系列的图表，我决定在图表的每一侧放置两个y轴，这是可行的。我唯一遇到的麻烦是显示每个y轴的所有标签，特别是我命名为“填充数据”的系列中的最后一个标签，显然是使用了电压数据的y轴

我尝试过切换系列和yAxis的顺序，但始终不会显示最后一个的标签。我还尝试过边距，以防它被隐藏，但绝对不是。我该如何解决？这是代码：

Highcharts.chart('container', {
    chart: {
        zoomType: 'xy',
        type: 'spline'
    },
    title: {
        text: 'Whatever'
    },
    xAxis: [{
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
            'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
        crosshair: true
    }],
      yAxis: [{ // Primary yAxis
            title: {
                text: 'Voltage',
                style: {
                    color: Highcharts.getOptions().colors[2]
                }
            },
                        labels: {
                format: '{value} V',
                style: {
                    color: Highcharts.getOptions().colors[2]
                }
            },
            opposite: true

        }, { // Secondary yAxis
            title: {
                text: 'Current',
                style: {
                    color: Highcharts.getOptions().colors[0]
                }
            },
            labels: {
                format: '{value} C',
                style: {
                    color: Highcharts.getOptions().colors[0]
                }
            },
        },
        { // Third yAxis
              gridLineWidth: 0,
              title: {
                  text: 'Temperature',
                  style: {
                      color: Highcharts.getOptions().colors[3]
                  }
              },
              labels: {
                  format: '{value}°C',
                  style: {
                      color: Highcharts.getOptions().colors[3]
                  }
              },
          opposite: true

          },
          { // Fourth yAxis
                title: {
                    text: 'stuff',
                    style: {
                        color: Highcharts.getOptions().colors[4]
                    }
                },
                labels: {
                    format: 'WHEREAMI',
                    style: {
                        color: Highcharts.getOptions().colors[4]
                    }
                },

      }],
    tooltip: {
        shared: true
    },
    legend: {
        layout: 'vertical',
        align: 'left',
        x: 80,
        verticalAlign: 'top',
        y: 55,
        floating: true,
        backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColor) || '#FFFFFF'
    },
    series: [
     {
        name: 'Voltage Data',
        data: [10.0, 20.79, 13.5, 18.8],
        yaxis: 0,
    },
    {
        name: 'Current Data',
        yAxis: 1,
        data: [1, 2, 3 , 4],

    }, {
        name: 'Temperature Data',
        yAxis: 2,
        data: [4, 5, 6 , 9]

    }, {
        name: 'Stuff Data',
        data: [7.0, 6.9, 9.5],
        yaxis: 3,
    }]
});

Answer 1

您必须使用正确的属性名称，xaxis与xAxis不同：

series: [
  {
    name: 'Voltage Data',
    data: [10.0, 20.79, 13.5, 18.8],
    yAxis: 0,
  },
  {
    name: 'Current Data',
    yAxis: 1,
    data: [1, 2, 3, 4],

  }, {
    name: 'Temperature Data',
    yAxis: 2,
    data: [4, 5, 6, 9]

  }, {
    name: 'Stuff Data',
    data: [7.0, 6.9, 9.5],
    yAxis: 3,
  }
]

实时演示：https://jsfiddle.net/BlackLabel/6wrahgko/

y轴上的第四个y轴不显示标签

1 个答案: