echarts
软件测试小菜鸟正在更新中
每一位程序员都不是利益驱动型的而是创新驱动型的
展开
-
子组件的echarts自适应父组件的div高度,并随着div的高度变化自动适应
这是index.vue父组件的一段代码:组件TrendLine是echarts的折线图。是子组件,trendLine.vue在trendLine.vue文件中,图表是根据浏览器变化自适应的。代码是:现在发现的问题是,并不会随着父组件中div高度大小自适应。解决方法:给echarts组件传一个height属性:渲染echarts的根组件里定义好height。props属性里声明height。watch里监听height,变化的时候,重新渲染echarts。initChart方法里原创 2022-04-07 09:01:05 · 2052 阅读 · 1 评论 -
echarts的Y轴的分割线以及线条样式
yAxis: { splitNumber: 5, splitLine: { show: true, lineStyle: { type: 'dotted', color: 'rgba(255, 255, 255,0.3)' } }}splitNumber代表Y轴分割的段数,splitLine设置分割线显示不显示。show:true是显示分割线。 lineStyle设置分割线的样式,type:'dotted’设置的原创 2022-04-06 10:14:53 · 8622 阅读 · 0 评论 -
echarts的yAxis设置最大值和最小值
yAxis:{ max: function(value) { if (yAxisMax !== 0) { return yAxisMax; } else { return null; } }, min: function(value) { if (yAxisMin !== 0原创 2022-04-06 08:53:52 · 5694 阅读 · 0 评论 -
echarts的xAxis的axisLabel的使用
xAxis的axisLabel是用来设置x轴的刻度以及一些参数的设置。axisLabel: { interval: 10, formatter: (value, index) => { // 1小时=3600秒 return `${(value / 3600).toFixed(0)}h`; }, inside: false,原创 2022-04-06 08:47:00 · 19825 阅读 · 0 评论 -
echarts处理返回的图例和数据是数组嵌套数组格式时的方法
当返回的数据格式是单个数组的时候,可以直接循环datas传入echarts组件进行复用。处理方式:tableData是接口的datas对象数据。<el-scrollbar ref="scrollbar" style="height:100%; width:100%;"> <el-row type="flex" justify="space-between" style="flex-wrap:wrap;height:30%"> <el-c原创 2022-03-14 16:55:39 · 1771 阅读 · 0 评论