我正在构建一个角度应用程序。其中我们需要创建用于放大和缩小图表的单击按钮。我们可以使用可悬停模式栏上的按钮放大缩小图表,但这对于我们的应用程序来说不是必需的。我们希望使用通过单击按钮创建的用户来放大和缩小图表。有没有办法使用单击按钮触发可悬停模式栏放大和缩小的操作?如果没有那么还有其他方法吗?任何建议表示赞赏。
Code in .ts file
basicChart() {
var trace1 = {
x: ['2020-10-04', '2021-11-04', '2023-12-04'],
y: [90, 40, 60],
type: 'scatter'
};
var data = [trace1];
var layout = {
title: 'Chart',
showlegend: false
};
Plotly.newPlot('myDiv', data, layout);
}
我遇到了同样的问题,最终只是使用 DOM 来单击模式栏。
缩放函数示例.js
const plot = Plotly.newPlot('myDiv', data, layout)
let zoomIn = function(plot){
plot.querySelector('a[data-attr="zoom"][data-val="in"]').click()
},
let zoomOut = function(plot){
plot.querySelector('a[data-attr="zoom"][data-val="out"]').click()
},
let resetView = function(plot){
plot.querySelector('a[data-attr="zoom"][data-val="reset"]').click()
},
CSS 隐藏模式栏:
.modebar-container{
display: none;
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)