![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
echarts
骑上我心爱的小摩托
掉入程序员的前端
展开
-
vue项目中实际构建echarts拓扑关系图业务
由于现在echarts的利用率增强,需要用到拓扑图的设计,如果单纯针对echarts文档来看,虽然可以利用API详细了解到功能点,但具体的实际运用与开发场景经验案例还是略有欠缺,下面将针对echarts关系拓扑图进行实例讲解。关系拓扑图,顾名思义,是有具体的关系存在的点,具有向量指向特点。那么就要求数据具备和的属性。思路是这样的,首先描绘物体(关系点),再者是描绘连接关系点的连线。简单效果图如上图,共4层类型,同一层为同一个类型,分别是:运维人员、数据库、应用、用户,连接线为起始到终点的指向关系2.测原创 2022-11-15 15:06:16 · 8696 阅读 · 1 评论 -
vue自定义指令添加跟随鼠标光标提示框v-tooltip
通过监听鼠标移入移出的mouse方法,设置浮层样式与出现时机。2、div显示dom标签v-tooltip。此时运行后,出现浮层。原创 2022-09-26 16:17:36 · 2688 阅读 · 0 评论 -
vue项目实现Echarts在label中获取点击事件
此时针对label进行点击后,还是无法获取点击事件,经检查,是未对yAxis添加label的event事件。在click点击事件内,可以打印出当前点击信息。应对需要点击label设置的属性添加。,此时label可进行点击。原创 2022-09-26 16:27:00 · 2664 阅读 · 0 评论 -
解决vCharts不兼容Echarts5+版本问题
根据报错信息来看,v-charts内所含子依赖"echarts-liquidfill"、"echarts-wordcloud"版本较低(elem团队已经4年未更新vcharts),再根据npm官网进行查询,发现最新echarts5.3.3关于此两子依赖为高版本,故不能兼容,此时只需要将此俩子依赖全部固定版本升级最新即可(根据echarts版本)解决了问题。若不需要考虑Echarts版本高低的问题,可以对Echarts进行降级使用。如果看不懂resolutions的,建议看我之前的博客。原创 2022-09-22 11:43:30 · 3379 阅读 · 0 评论 -
Echats关系图les-miserables的图表详细解析(和弦图)(二)
和弦图在实际运用中还是不可或缺的,结合echarts插件进行使用,可以提高工作效率,话不多说,上代码。原创 2022-08-23 15:44:54 · 1478 阅读 · 0 评论 -
vue项目实现Echarts在tooltip中获取点击事件
此时针对tooltip设置了点击事件,formatter配置了两个点击事件,可自行设置样式todoSthLook方法内绑定了方法回调,先获取当前class对象,获取后进行点击事件监听,即可解决问题如果觉得还不错的话,给个关注或者点赞吧!...原创 2022-06-20 18:35:07 · 2962 阅读 · 3 评论 -
解决d3.event在v7版本无效影响zoom拖拽缩放问题
近期由于代码内关于d3版本的更新,由原来的v3 v4更新值v7.0.0,导致原有关于d3的波点图内zoom方法的拖拽缩放、tooltip提示框问题开始报错,即d3.event数据废弃了1、设置d3图形的缩放配置时,在d3.event.transform.x中,即提示Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'x')此时可在zoom方法内,使用匿名函数获取当前参数current,参数内即原创 2022-03-02 13:20:12 · 2779 阅读 · 1 评论 -
Failed to execute ‘drawImage‘ on ‘CanvasRenderingContext2D‘: The image argument is a canvas element
Echarts重绘报错,原因在于绘制时,未正确获取到画布的宽高,可在容器内写入行内样式,即可解决<template> <div class="g2-chart-container" style="height: 300px;"> <div v-show="hasData" :id="id" class="g2-chart" style="height: 300px; width: 100%;" />.原创 2022-02-25 16:32:18 · 7459 阅读 · 0 评论