javascript Highcharts:添加自定义图片按钮
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/9218490/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Highcharts: Add a custom image button
提问by Jashwant
I want to add and image button on highcharts. So far, I have successfully created a image button and have attached a click event on it. But problem is that, the image (sun.png) is on left side of chart and image button is right aligned ( the default position of toolbar). Any fix for this ?
我想在 highcharts 上添加图像按钮。到目前为止,我已经成功创建了一个图像按钮并在其上附加了一个点击事件。但问题是,图像 (sun.png) 位于图表左侧,图像按钮右对齐(工具栏的默认位置)。有什么解决办法吗?
exporting: {
buttons: {
popUpBtn: {
symbol: 'url(images/sun.png)',
_titleKey: 'popUpBtnTitle',
x: -10,
symbolFill: '#B5C9DF',
hoverSymbolFill: '#779ABF',
onclick: function () {
alert('ad');
popUpChart($(this));
}
},
exportButton: {
enabled: false
},
printButton: {
enabled: false
}
}
}
Also, if there are other methods to add an image in chart which have click event, those methods are welcomed too.
另外,如果有其他方法可以在具有点击事件的图表中添加图像,也欢迎使用这些方法。
回答by Jashwant
Finally, I figured it out like this. May be it will help others.
最后,我是这样想出来的。也许它会帮助别人。
function callback($this){
var img = $this.renderer.image('images/zoom_icon.png',$this.chartWidth-40,5,40,12);
img.add();
img.css({'cursor':'pointer'});
img.attr({'title':'Pop out chart'});
img.on('click',function(){
// prcessing after image is clicked
});
}
new Highcharts.Chart(charts.params,callback);
// where charts.params is object which contains options for chart