Echarts
人比黄花嗖
这个作者很懒,什么都没留下…
展开
-
深入理解echarts的markline标注线
在移动端需求中,经常遇到echarts折线图需要在折线图的末尾节点添加标注文字,进行显示,是的用户能更加显眼的看到数据分析情况,这就需要使用echarts的markline进行实现:直接贴代码option ={ xAxis: { splitLine: { show: false, }, axisLabel: { color: '#fff', rotate: '35原创 2020-11-30 15:57:48 · 25802 阅读 · 6 评论 -
h5页面echarts的tooltip属性解析及解决tooltip超出容器的问题
h5页面经常会遇到echarts的需求,这两周在开发过程中发现tooltip在h5页面总是会因为内容过多而超出,特作出如下解决方案: tooltip: { trigger: 'axis', confine: true, // 该属性可使tooltip一直处于容器中 transitionDuration: 0, position: function (point, params, dom, rect, size) {原创 2020-08-11 13:51:18 · 1296 阅读 · 0 评论 -
解决ios13版本echarts的tooltip在页面滚动时出现白色线条问题
在做开发过程中,发现在ios手机上滑动时,echarts的tooltip会放置在柱子的下层并出现白条,刚开始以为是层级问题,通过给tooltip添加层级进行解决,发现设置层级并不能解决该问题,最后查看api发现可通过设置属性进行实现,解决方案如下:设置tooltip的position,即重置tooltip的位置进行显示,即可解决。position: function (point, params, dom, rect, size) {dom.style.transform = "transla原创 2020-08-11 13:41:34 · 726 阅读 · 0 评论 -
echarts 滚动组件dataZoom解析之h5自定义dataZoom组件样式
因h5页面需求:需要用柱状图展示一个季度内的数据统计情况,而在手机端,只能采用滚动条进行实现,但是echarts自带的滚动组件在手机端不是特别美观,故对其属性进行修改:dataZoom: [//给x轴设置滚动条 { type: 'slider',//slider表示有滑动块的,inside表示内置的 // startValue: 8,//可用于设置开始显示的柱子的长度 // endValue: 1,//可用于设原创 2020-08-11 13:33:24 · 6080 阅读 · 0 评论 -
echarts的相关属性解读
ECharts,一个使用 JavaScript 实现的开源可视化库,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器。底层依赖轻量级的矢量图形库 ZRender,提供直观,交互丰富,可高度个性化定制的数据可视化图表。同时,底层采用canvas画图实现图像的渲染。代码详解:theme = {// 全图默认背景// backgroundColor: 'rgba(...原创 2020-02-26 21:35:25 · 355 阅读 · 0 评论 -
Echarts和Easyui实现西安某医院就诊情况统计
主要采用Echarts是西安对数据的可视化管理,包括折线图,柱状图,中国地图等多种展现方式,其中中国地图可实现穿透至省地图进行数据查看功能。截图如下:...原创 2019-07-17 23:29:34 · 470 阅读 · 0 评论