首页 > 其他分享 >ECharts点击横坐标事件实现超链接跳转

ECharts点击横坐标事件实现超链接跳转

时间:2023-06-02 10:34:40浏览次数:34  
标签:... 点击 横坐标 微博 params 超链接 跳转 ECharts

需求:微博排行榜,横坐标展示出了微博对应的id,现在需要通过点击横坐标来实现跳转到对应的微博页面。


  1. 设置横坐标中的triggerEvent属性为true;
xAxis: {
  ...
  triggerEvent: true,
  ...
},
  1. 添加on点击事件。
thisChart.on("click" ,function (params) {
  window.location.href = "https://m.weibo.cn/detail/" + params.value;
});

最终结果:符合预期。

标签:...,点击,横坐标,微博,params,超链接,跳转,ECharts
From: https://www.cnblogs.com/Shineloner/p/17451045.html

相关文章

  • Echarts——如何默认选中图表并显示tooltip
    前言参考资料实现预览地址内容很简单借助于dispatchAction来触发事件;import*asechartsfrom'echarts';varchartDom=document.getElementById('main');varmyChart=echarts.init(chartDom);varoption;option={tooltip:{trigger:'axis'......
  • 解决打开IE,自动跳转到Edge方法之一
    桌面上右键快捷方式,对象位置输入  如下内容。。。"C:\ProgramFiles(x86)\InternetExplorer\iexplore.exe"https://www.baidu.com/#ie={inputEncoding}&wd=%s-Embedding 其中  https://www.baidu.com  是可以改为自己需要的地址 ......
  • echarts更新数据后报错 There is a chart instance already initialized on the dom
    产生原因使用Echarts插件的时候,多次加载会出现Thereisachartinstancealreadyinitializedonthedom.的警告,表示DOM上已经初始化了一个图表实例。解决方案定义一个全局变量,在初始化之前先判断该实例是否存在,若存在,先销毁。varmyChart;//全局变量functiondrawChart(......
  • 手机端sso无法正常跳转
    Vue3前端.NET后端开发问题记录:1.钉钉sso,PC端跳转不受影响,但是手机端无法加载sso。发现是钉钉api版本落后导致,不更新版本的情况下需要在index.html文件中<head>中添加  <script>   this.globalThis||(this.globalThis=this);  </script>......
  • JS 判断域名并跳转到指定页面
    判断访问指定域名,进行页面跳转<!DOCTYPEhtml><html><head> <title>正在玩命加载中……</title> <!--判断来路域名自动跳转--> <scripttype="text/javascript"> varhref=location.href;//获取当前请求路径if(href.indexOf("vi......
  • echarts入门教程(超级详细带案例)
    ————————————————版权声明:本文为CSDN博主「争儿不脱发」的原创文章,遵循CC4.0BY-SA版权协议,转载请附上原文出处链接及本声明。原文链接:https://blog.csdn.net/m0_55734030/article/details/127559434一.echarts的介绍1、echarts是一款基于JavaScript的数据可......
  • MobTech MobLink|小程序、网页跳转App的原理
    从不同的渠道,如小程序、二维码、网页等,直接跳转到App内对应的页面,并传递相关的参数信息,已经由移动还原解决方案MobLink实现了。本文将详细介绍多样化跳转技术的原理。MobLink的功能架构MobLink的功能架构如下图所示:从图中可以看出,MobLink主要涉及三个部分:客户端、服务器和网页。客......
  • echarts——环形图,异步请求数据后,有数据但图不显示
    echats官网:https://echarts.apache.org/ 我的原因:series里的data数据,需要是value,name格式,我的后台返回的数据是{number:1,typeName:'1'}解决方法:做下转换res.result.forEach(item=>{item.name=item.typeName;item.value=item.number;}) ......
  • Echarts 阴影点击事件获得当前柱状图的索引值方法
    Echarts阴影点击事件获得当前柱状图的索引值方法//什么在option外面的变量varclickIndex;option={//配置信息tooltip:{//提示框//提示触发类型:不触发trigger:'none',},//formatter回调函数,formatter:val=>{......
  • echarts堆叠柱状图上方展示两个数据项的总和
        //当月漏项统计排名getIndicatorCurve(data1){echarts.init(document.getElementById('lineOption5')).dispose()//销毁实例//找到容器letmyEcharts=echarts.init(document.getElementById('lineOption5'),......