Javascript Highchart隐藏默认按钮
我想隐藏highchart导出选项中的默认按钮(“导出”和“打印”) 你可以在这个链接有3个按钮演示 1.自定义按钮 2.导出按钮 3.打印按钮Javascript Highchart隐藏默认按钮,javascript,jquery,highcharts,highstock,Javascript,Jquery,Highcharts,Highstock,我想隐藏highchart导出选项中的默认按钮(“导出”和“打印”) 你可以在这个链接有3个按钮演示 1.自定义按钮 2.导出按钮 3.打印按钮 在这种情况下,我只想显示第一个按钮并隐藏“导出按钮”和“打印按钮”这不可能作为选项,但您可以隐藏默认按钮,然后使用html创建自己的按钮。然后,您可以根据需要绑定自定义按钮 var chart = new Highcharts.Chart({ chart: { renderTo: 'container' },
在这种情况下,我只想显示第一个按钮并隐藏“导出按钮”和“打印按钮”这不可能作为选项,但您可以隐藏默认按钮,然后使用html创建自己的按钮。然后,您可以根据需要绑定自定义按钮
var chart = new Highcharts.Chart({
chart: {
renderTo: 'container'
},
credits: {
enabled: false
},
xAxis: {
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
},
series: [{
data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
}],
exporting: {
enabled: false
}
});
console.log( Highcharts.Renderer.prototype.symbols )
您可以通过以下方式访问每个按钮首选项:
exporting: {
buttons: {
printButton: {
symbol: 'circle'
},
exportButton: {
enabled: false
}
}
}
自定义按钮的可扩展示例如下:
exporting: {
buttons: {
printButton: {
enabled: false
},
exportButton: {
enabled: false
},
custom: {
symbol: 'diamond',
x: -62,
symbolFill: '#B5C9DF',
hoverSymbolFill: '#779ABF',
_titleKey: 'printButtonTitle',
onclick: function () {
alert('click!')
}
}
}
}
对于使用highcharts较新版本且所选答案无效的任何其他人,您需要使用下面的按钮来隐藏按钮
exporting: {
buttons: {
contextButton: {
enabled: false
}
}
}
如果您只想隐藏默认自定义按钮,只需使用:
exporting: {
buttons: {
contextButton: {
enabled: false
},
printButton: {
enabled: false,
},
}
}
如果您想使用自己的自定义按钮或标签,可以使用:
exporting: {
buttons: {
contextButton: {
enabled: false
},
exportButton: {
text: `Chrome`,
_titleKey: "yourKey",
onclick:function(){
alert('clicked Chrome');
},
x:-410
},
printButton: {
enabled: false,
text: `IE: `,
_titleKey:"myKey",
onclick: function () {
alert('clicked IE');
},
x:-400,
y:30
},
}
},
在这里,我禁用了默认设置和printButton,您可以使用x和y设置标签的位置。
您可以在fiddle中找到我的代码:如果您使用的是框架,那么您可以通过这种方式隐藏
HIOptions *options = [[HIOptions alloc]init];
HIExporting *exporting = [[HIExporting alloc]init];
exporting.enabled = [[NSNumber alloc] initWithBool:false];
options.exporting = exporting;
对于当前的highcharts(7.2.1),您可以通过设置下面的选项来隐藏它们
exporting: {
buttons: {
contextButton: {
menuItems: ["downloadPNG", "downloadJPEG", "downloadPDF", "downloadSVG"]
}
}
}
在查看API我是海图新手。看起来单个按钮禁用在最新版本中不起作用?是的,在新版本中,它仍然显示按钮。它没有隐藏。任何帮助都将不胜感激。