栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > Web开发 > JavaScript

echarts踩过的坑

JavaScript 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

echarts踩过的坑

一、echarts外的容器设置了百分比,又遇到了tab切换

echarts绘制图表计算宽度的时候,由于第二个tab的属性display: none;所以无法获取到clientWidth,而 parseInt(stl.width, 10)) 将width: 100%;转为100,所以计算出的图表宽度为100px,效果如下:

计算具体的值,赋给容器div

二、echarts的提示层的内容都是拼接的,还需要把小图例显示出来

formatter: (params)=> {

if(params && params.length > 0){

let ftmArr = new Array(), marker;

for(let i = 0, len = params.length; i < len; i++){

marker = params[i].marker.replace(/border-radius:d+px/, 'border-radius:0px');

ftmArr.push(`${marker} ${params[i].seriesName}:  ${params[i].value}%
`); } return ftmArr.join(''); } }

marker是小图例,console.log出来可以看到他是个span标签,可以随意替换他的样式

三、从新渲染echarts,要先把之前的数据清掉
barBackCarType.clear();

四、动态计算高度付给echarts的容器,echarts取不到这个值要resize下echarts
barBackCarType.resize();
五、轴线名称对齐问题

方法一:可以用padding负值来跟轴线刻度对齐,但是ie8不兼容

方法二:把轴线名称写在轴线刻度里,无兼容性问题

转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/243936.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号