Javascript Highcharts时间轴重命名系列标签

Javascript Highcharts时间轴重命名系列标签,javascript,html,css,highcharts,timeline,Javascript,Html,Css,Highcharts,Timeline,我有这个Highcharts时间线,我想重命名系列标签,使其更具描述性(而不是显示“系列1”、“系列2”等),换句话说,是一个有意义的标签名称 我认为这就像添加括号和调用name属性一样简单,但这无法呈现。 这很麻烦,因为这是我能找到的关于Highcharts中系列命名的唯一文档 代码如下: <script> (function(H) { H.seriesTypes.timeline.prototype.getXExtremes = function(xData) {

我有这个Highcharts时间线,我想重命名系列标签,使其更具描述性(而不是显示“系列1”、“系列2”等),换句话说,是一个有意义的标签名称

我认为这就像添加括号和调用name属性一样简单,但这无法呈现。 这很麻烦,因为这是我能找到的关于Highcharts中系列命名的唯一文档

代码如下:

<script>
(function(H) {

  H.seriesTypes.timeline.prototype.getXExtremes = function(xData) {
    var series = this;

    return {
      min: H.arrayMin(xData),
      max: H.arrayMax(xData)
    };
  }
}(Highcharts));

Highcharts.dateFormats = {
  q: function(timestamp) {
    var date = new Date(timestamp),
      quarter = (Math.floor(date.getUTCMonth() / 3) + 1);
    return quarter;
  }
};
Highcharts.chart('container', {
  chart: {
    zoomType: 'x',
    type: 'timeline'
  },
  //xAxis: {
  //type: 'datetime',
  //visible: true
  //},
  xAxis: {
    type: 'datetime',
    units: [ // responsive ticks
      ['month', [3, 6]],
      ['year', [1]]
    ],
    labels: {
      format: '{value:Q%q\'%y}',
      //rotation: -30
    }
  },
  yAxis: {
    gridLineWidth: 1,
    title: null,
    labels: {
      enabled: false
    }
  },
  legend: {
    enabled: true
  },
  title: {
    text: '<strong><font size="+10">INITIATIVE TIMELINE</font></strong>'
  },
  subtitle: {
    text: ''
  },
  tooltip: {
    style: {
      width: 300
    }
  },
  credits: {
    enabled: false
  },
  plotOptions: {
    timeline: {
      lineWidth: 0,
      legendType: '',
      showInLegend: true,
      colorByPoint: false,
      dataLabels: {
        allowOverlap: true,
        format: '<span style="color:{point.color}">● </span><span style="font-weight: bold;" > ' +
          '{point.x:%d %b %Y}</span><br/>{point.label}'
      },
      marker: {
        symbol: 'circle'
      },
    }
  },
  series: [{
    dataLabels: {
      distance: 40
    }, {name: 'TEST1',
    data: [{
      x: Date.UTC(1951, 5),
      name: 'First dogs in space',
      label: 'First dogs in space',
      description: "Dezik and Tsygan were the first dogs to make a sub-orbital flight on 22 July 1951. Both dogs were recovered unharmed after travelling to a maximum altitude of 110 km."
    }, {
      x: Date.UTC(1971, 11, 2),
      name: 'First soft Mars landing',
      label: 'First soft Mars landing',
      description: "Mars 3 was an unmanned space probe of the Soviet Mars program which spanned the years between 1960 and 1973. Mars 3 was launched May 28, 1971, nine days after its twin spacecraft Mars 2. The probes were identical robotic spacecraft launched by Proton-K rockets with a Blok D upper stage, each consisting of an orbiter and an attached lander."
    }, {
      x: Date.UTC(1976, 3, 17),
      name: 'Closest flyby of the Sun',
      label: 'Closest flyby of the Sun',
      description: "Helios-A and Helios-B (also known as Helios 1 and Helios 2) are a pair of probes launched into heliocentric orbit for the purpose of studying solar processes. A joint venture of West Germany's space agency DFVLR (70 percent share) and NASA (30 percent), the probes were launched from Cape Canaveral Air Force Station, Florida."
    }]}
  }, {
    dataLabels: {
      distance: 90
    }, {name: 'TEST2',
    data: [{
      x: Date.UTC(1959, 0),
      name: 'First artificial satellite to reach the Moon',
      label: 'First artificial satellite to reach the Moon',
      description: "Luna 1 was the first artificial satellite to reach the Moon vicinity and first artificial satellite in heliocentric orbit."
    }, {
      x: Date.UTC(1966, 1),
      name: 'First soft landing on the Moon',
      label: 'First soft landing on the Moon',
      description: "Yuri Gagarin was a Soviet pilot and cosmonaut. He became the first human to journey into outer space when his Vostok spacecraft completed one orbit of the Earth on 12 April 1961."
    }, {
      x: Date.UTC(1989, 7, 8),
      name: 'First astrometric satellite',
      label: 'First astrometric satellite',
      description: "Hipparcos was a scientific satellite of the European Space Agency (ESA), launched in 1989 and operated until 1993. It was the first space experiment devoted to precision astrometry, the accurate measurement of the positions of celestial objects on the sky."
    }]}
  }
});
</script>

(职能(H){
H.seriesTypes.timeline.prototype.getXExtremes=函数(扩展数据){
var系列=此;
返回{
最小值:H.arrayMin(扩展数据),
最大值:H.arrayMax(扩展数据)
};
}
}(高图);
Highcharts.dateFormats={
q:函数(时间戳){
var日期=新日期(时间戳),
季度=(数学楼层(date.getUTCMonth()/3)+1);
返回季度;
}
};
Highcharts.chart('容器'{
图表:{
zoomType:'x',
键入:“时间线”
},
//xAxis:{
//键入:“日期时间”,
//可见:正确
//},
xAxis:{
键入:“日期时间”,
单位:[//响应滴答声
['月',[3,6]],
[‘年’,[1]]
],
标签:{
格式:“{value:Q%Q\'%y}”,
//轮换:-30
}
},
亚克斯:{
网格线宽度:1,
标题:空,
标签:{
已启用:false
}
},
图例:{
已启用:true
},
标题:{
文本:“倡议时间表”
},
副标题:{
文本:“”
},
工具提示:{
风格:{
宽度:300
}
},
学分:{
已启用:false
},
打印选项:{
时间线:{
线宽:0,
legendType:“”,
showInLegend:是的,
colorByPoint:false,
数据标签:{
allowOverlap:是的,
格式:'●  ' +
“{point.x:%d%b%Y}
{point.label}” }, 标记:{ 符号:“圆圈” }, } }, 系列:[{ 数据标签:{ 距离:40 },{name:'TEST1', 数据:[{ x:UTC日期(1951年5月), 名称:“太空中的第一只狗”, 标签:“太空中的第一只狗”, 描述:“Dezik和Tsygan是1951年7月22日第一只进行亚轨道飞行的狗。这两只狗在飞行到110公里的最高高度后都安然无恙地康复了。” }, { x:UTC日期(1971年11月2日), 名称:“首次火星软着陆”, 标签:“首次火星软着陆”, 说明:“火星3号是苏联火星计划(1960年至1973年)的无人驾驶空间探测器。火星3号于1971年5月28日发射,距离它的孪生航天器火星2号晚九天。这些探测器是由质子-K火箭发射的相同的机器人航天器,带有一个Blok D上级,每个都由一个轨道器和一个附加的着陆器组成。” }, { x:UTC日期(1976年3月17日), 名称:'最近的太阳飞行', 标签:“离太阳最近的飞行距离”, 描述:“Helios-A和Helios-B(也称为Helios 1和Helios 2)是一对发射到日心轨道的探测器,用于研究太阳过程。这是西德航天局DFVLR(70%的份额)和美国宇航局(30%)的合资企业,由佛罗里达州卡纳维拉尔角空军站发射。” }]} }, { 数据标签:{ 距离:90 },{name:'TEST2', 数据:[{ x:UTC日期(1959年,0), 名称:“第一颗到达月球的人造卫星”, 标签:“第一颗到达月球的人造卫星”, 描述:“月球1号是第一颗到达月球附近的人造卫星,也是第一颗日心轨道上的人造卫星。” }, { x:UTC日期(1966年1月), 名称:“首次月球软着陆”, 标签:“首次月球软着陆”, 描述:“尤里·加加林(Yuri Gagarin)是苏联飞行员和宇航员。1961年4月12日,他的沃斯托克太空船完成了地球的一个轨道,他成为第一个进入外层空间的人。” }, { x:UTC日期(1989年7月8日), 名称:“第一颗天体测量卫星”, 标签:“第一颗天体测量卫星”, 描述:“Hipparcos是欧洲航天局(ESA)的一颗科学卫星,于1989年发射,一直运行到1993年。它是第一个致力于精确天体测量的空间实验,精确测量天体在天空中的位置。” }]} } });

感谢您的帮助。

在您的代码中,缺少了几个括号,但为序列添加名称的想法是正确的。
此属性存在于时间轴系列上。

系列:[{
数据标签:{
距离:40
},
名称:“TEST1”,
数据:[{
API:

现场演示:

谢谢,我的语法有问题。效果很好