javascript - 是否可以在区域范围图表顶部显示文本

Question

        Highcharts.chart('container', {

            chart: {
                type: 'arearange',
                zoomType: 'x',
                scrollablePlotArea: {
                    minWidth: 600,
                    scrollPositionX: 1
                }
            },

            title: {
                text: 'Temperature variation by day'
            },

            xAxis: {
                //type: 'datetime',
                accessibility: {
                    rangeDescription: 'Range: Jan 1st 2017 to Dec 31 2017.'
                }
            },

            yAxis: {
                title: {
                    text: null
                },
                labels: {
                    enabled:true
                }
            },

            

            legend: {
                enabled: false
            },
plotOptions: {
          series: {
              //stacking: 'normal',
              borderColor: '#303030',
              color : '#cac9c9',
              lineWidth: 1,
              marker: {
                  lineWidth: 1,
                  lineColor: '#303030'
              }
          },
          dataLabels: {
              useHTML: true,
              enabled: true,
              inside: true,
              align:'left',
              allowDecimals: true,
              formatter: function(){
                  return "SOME_TEXT_INSIDE_HTML_TAG";
              }
            },
        },
                series: [{
                        data: [
                        [0, 10],
                        [0, 10],
                    ],
                    borderColor: 'black',
                            borderWidth: 0.2,
                },
                {
                    data: [
                        [20, 40],
                        [20, 40],
                    ]
                }]

        });

以上是区域范围图的代码。几个问题。

1. 我只想在每个区域的顶部显示一些随机文本。我尝试使用 dataLabels，但似乎没有用。难道不能这样做吗？
2. 当鼠标悬停在图表上时，Yaxis 似乎显示在 AreaRange 图表中。可以设置为默认显示吗？

任何帮助将非常感激。提前致谢。

标签： javascriptphpjquerychartshighcharts

Answer 1

我试图重现您的代码，这是一个输出：https ://jsfiddle.net/BlackLabel/uqmyjsr9/

1. 配置dataLabels需要嵌套在series对象中。

      plotOptions: {
        series: {
          //stacking: 'normal',
          borderColor: '#303030',
          color: '#cac9c9',
          lineWidth: 1,
          marker: {
            lineWidth: 1,
            lineColor: '#303030'
          },
          dataLabels: {
            useHTML: true,
            enabled: true,
            inside: true,
            align: 'left',
            allowDecimals: true,
            formatter: function() {
              return "SOME_TEXT_INSIDE_HTML_TAG";
            }
          },
        },
      },
   

2. 我不确定 - yAxis 一直显示，不仅在悬停在图表上之后。