Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/440.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript Highchart注释单击事件不';行不通_Javascript_Highcharts - Fatal编程技术网

Javascript Highchart注释单击事件不';行不通

Javascript Highchart注释单击事件不';行不通,javascript,highcharts,Javascript,Highcharts,我正在尝试在Highchart批注上添加单击事件,但它不起作用 我尝试在annotation对象上设置events属性,如下所述: 事件 鼠标,点击,点击。回调中的这个引用了注释 反对 我在这里找不到任何有关注释事件的信息: 我做错了什么 //从中生成的数据http://www.bikeforums.net/professional-cycling-fans/1113087-2017-tour-de-france-gpx-tcx-files.html 变量提升数据=[ [0.0, 225],

我正在尝试在Highchart批注上添加单击事件,但它不起作用

我尝试在annotation对象上设置events属性,如下所述:

事件 鼠标,点击,点击。回调中的这个引用了注释 反对

我在这里找不到任何有关注释事件的信息:

我做错了什么

//从中生成的数据http://www.bikeforums.net/professional-cycling-fans/1113087-2017-tour-de-france-gpx-tcx-files.html
变量提升数据=[
[0.0, 225],
[0.1, 226],
[0.2, 228],
[0.3, 228],
[0.4, 229],
[0.5, 229],
[0.6, 230],
[0.7, 234],
[0.8, 235],
[0.9, 236],
[1.0, 235],
];
//现在创建图表
Highcharts.chart('容器'{
图表:{
类型:'区域',
zoomType:'x',
平移:是的,
平移键:“shift”,
可滚动绘图区:{
最小宽度:600
}
},
标题:{
文字:“2017环法自行车赛第8阶段:多尔-罗斯车站”
},
副标题:{
文本:“Highcharts中的注释图表”
},
注释:[{
标签选项:{
背景颜色:“rgba(255255,0.5)”,
垂直排列:“顶部”,
y:15
},
标签:[{
要点:{
xAxis:0,
雅克斯:0,
x:0.9,
y:235,
},
文本:“Arbois”,
}],
活动:{
单击:函数(e){alert('test');}
}
}],
xAxis:{
标签:{
格式:“{value}km”
},
最小范围:5,
标题:{
文本:“距离”
}
},
亚克斯:{
是的,
恩东蒂克:错,
最大填充:0.35,
标题:{
文本:空
},
标签:{
格式:“{value}m”
}
},
工具提示:{
HeadePerformat:'距离:{point.x:.1f}公里
', pointFormat:“{point.y}m a.s.l.”, 分享:真的 }, 图例:{ 已启用:false }, 系列:[{ 数据:高程数据, lineColor:Highcharts.getOptions().Color[1], 颜色:Highcharts.getOptions().colors[2], 填充不透明度:0.5, 名称:'立面', 标记:{ 已启用:false }, 阈值:空 }] });
#容器{
最大宽度:800px;
最小宽度:380px;
高度:400px;
保证金:1em自动;
}

它不受支持,但实现起来非常简单和快速。您需要在
initLabel
函数上执行换行,调用
继续
后,只需分配注释/标签对象中定义的事件。下面是处理单击事件的示例代码:

(function(H) {
  H.wrap(H.Annotation.prototype, 'initLabel', function(proceed, shapeOptions) {
    proceed.apply(this, Array.prototype.slice.call(arguments, 1));

    var label = this.labels[this.labels.length - 1]
    var annotation = label.annotation
    if (label && annotation) {
      label.element.onclick = label.options.events.click || annotation.options.events.click
    }
  })
})(Highcharts)
它指定标签对象中定义的事件,但如果未定义,则直接从所有标签的注释对象获取函数定义

此外,您还可以在此处阅读有关Highcharts.wrap()函数的更多信息:

下面是使用它的示例:

[编辑]

自v7.0以来,不再需要Wrap方法。只需删除wrap方法并保留常规注释对象中的事件定义


实例:

它不受支持,但实现起来非常简单和快速。您需要在
initLabel
函数上执行换行,调用
继续
后,只需分配注释/标签对象中定义的事件。下面是处理单击事件的示例代码:

(function(H) {
  H.wrap(H.Annotation.prototype, 'initLabel', function(proceed, shapeOptions) {
    proceed.apply(this, Array.prototype.slice.call(arguments, 1));

    var label = this.labels[this.labels.length - 1]
    var annotation = label.annotation
    if (label && annotation) {
      label.element.onclick = label.options.events.click || annotation.options.events.click
    }
  })
})(Highcharts)
它指定标签对象中定义的事件,但如果未定义,则直接从所有标签的注释对象获取函数定义

此外,您还可以在此处阅读有关Highcharts.wrap()函数的更多信息:

下面是使用它的示例:

[编辑]

自v7.0以来,不再需要Wrap方法。只需删除wrap方法并保留常规注释对象中的事件定义


活生生的例子:

ok my bad没有读到,thx。ok my bad没有读到,thx。感谢4不幸的是,我的highchart中的共享看起来不起作用:(你能告诉我哪里不起作用吗?也许你能给我举个例子,问题发生在哪里?谢谢4支持我会做一些其他的测试,让你知道更多。嘿@daniel_s你能更新JSFIDLE并告诉我如何获得注释点击的x和y位置吗?谢谢4不幸的是在我的high中分享图表看起来不起作用:(你能告诉我哪里不起作用吗?也许你能给我举个例子,问题发生在哪里?谢谢4支持,我会做一些其他的测试,让你知道更多。嘿@daniel\s你能更新JSFIDLE并告诉我如何获得注释点击的x和y位置吗?