1.背景及说明
1.1 背景
帆软设计器可通过特效-交互属性添加图表超链,但是只能在图表区域进行点击,当想要在标签、坐标轴标签实现点击跳转时,设计器无法直接实现该功能
1.2 说明
本文仅作思路参考,可能有更好的方法去实现,大佬们勿喷
2.实现思路
1.在页面中找到对应元素绑定js点击事件
2.在自定义标签中使用a标签拼接
3.实现
3.1分析页面后,给对应元素绑定点击事件
预览图
![tstmp_20230914085203.gif](upload/wenda/20230914/1694652730854608.gif)
审查页面元素,分析标签为一个个的path标签,找到对应标签后绑定点击事件即可
![](https://hwobs-sq.fanruan.com/shequ_forum/image/7412c572bd63d0b47a44ca299a37baa7.jpg)
JS代码加到图表初始化事件
![](https://hwobs-sq.fanruan.com/shequ_forum/image/962a030654df39dc07c31483dfd0a1d9.jpg)
setTimeout(function() {
$('div[id^="chartABC"] .seriesTextRenderGroup g:first path:even').on('click', function() {
FR.Msg.alert("我是弹窗", "我是弹窗内容")
});
}, 1500)
3.2轴标签点击跳转
预览图
![动画1.gif](upload/wenda/20230914/1694655753700428.gif)
![](https://hwobs-sq.fanruan.com/shequ_forum/image/d84429a25a2a82ffdb5c132cc3dda31f.jpg)
function(){
$("div[id^='chart0000000'] div:first").css('pointer-events','')
var urlString = this.toString();
return `${urlString}`;
}
|