【问题标题】:Highcharts: How to rename seriesHighcharts:如何重命名系列
【发布时间】:2011-11-09 20:09:37
【问题描述】:

我在我的网络应用程序中使用 highcharts,我想知道在创建图表后是否有任何方法可以重命名系列??

提前致谢!!

【问题讨论】:

    标签: javascript rename highcharts series


    【解决方案1】:

    其实,现在有办法了。在highchars 3.0系列中新增了一个api,叫做update:

    chart.series[0].update({name:"name u want to change"}, false);
    chart.redraw();
    

    它不仅会更新图表下方的系列名称,还会更新工具提示中的名称。

    干杯!

    【讨论】:

    • 此方法有效,推荐使用 eolsson 接受的答案。
    • 似乎添加错误标志并没有多大作用。我把它拿出来,不再需要调用chart.redraw()
    • 根据Highcharts提供的文档,最后一个flag用来表示图表是否重绘。
    【解决方案2】:

    这似乎有效:

    chart.series[1].name="Renamed";
    chart.redraw();
    

    【讨论】:

      【解决方案3】:

      API 中没有执行此操作的方法。您可以删除该系列并用另一个名称再次添加它,但这会使动画再次运行,我认为它也会用新颜色着色。

      【讨论】:

      • 谢谢,效果很好,让动画第二次运行看起来不错,如果你采用默认设置颜色会改变,是的,但是你可以自己设置颜色,这不是问题,或者。
      【解决方案4】:

      不需要重新绘制图表 我们可以将它与系列选项一起包含在图表声明中,如下所示:

              var chart = new Highcharts.Chart({
              chart: {
                  renderTo: 'high_container'
              },title: {
                  text: 'IO Signal  Data'
              },subtitle: {
                  text: 'Source: GPS Modem'
              },
      
              yAxis: {
                  title: {
                      text: 'Value'
                  }
              },
              legend: {
                  layout: 'vertical',
                  align: 'right',
                  verticalAlign: 'middle'
              },
      
      
              xAxis: {
                  type: 'datetime',
                  labels: {
                      enabled: true,
                      formatter: function () { return ddd[this.value][0]; }, //<=== the value to plot chart
      
                  }
              },
              series: [{
                  data: ddd,
                  name: SeriesName
              }]
          });
      

      【讨论】:

      • 很抱歉投了反对票,但问题是关于如何重命名系列,而不是在实例化图表时如何设置其名称。此外,示例中的大部分代码无论如何都无关紧要。
      【解决方案5】:

      您可以使用以下方式更改系列名称:

      $(chart.series[0].legendItem.element).children('tspan').text('newLabelName');
      

      【讨论】:

        猜你喜欢
        • 2016-10-15
        • 1970-01-01
        • 1970-01-01
        • 2013-08-29
        • 2020-01-30
        • 1970-01-01
        • 1970-01-01
        • 2020-04-25
        • 2013-08-08
        相关资源
        最近更新 更多