echarts小记

记录一下echarts常用的一些配置

笔记阶段:草稿

一些资源相关

  • 图例
    Apache ECharts 图示常见效果
    一些动态效果 一些动态和3d效果
    v-charts 例子很少,还不如直接看上面第一个快

  • 横纵轴名称(如y轴)
    options.yAxis.name

  • x轴(斜向)显示不全
    xAxis.axisLabel 配置 {rotate: Number, interval: Number}
    options.grid 合理配置 {left: "10%", bottom: "40%"} ,尺寸根据需求调整'

  • 显示模糊
    使用svg模式绘制或者设置分辨率
    配置初始化时的第三个参数
    echarts.int(dom, null, {renderer: "svg", devicePixelRatio: 2.5}),二选一即可

  • 柱形图使用三角形
    options.series 里柱形渲染配置项中 {type: "pictorialBar", symbol: "triangle"} 即可
    那些到处抄,说只修改symbol,不标明type的,你的良心不会痛吗😑

  • 柱形图顶部显示文本
    options.series 配置如 {label: {show: true, position: "top", textStyle: {color: "#eeeeee",}}},即可

  • 柱形图顶(曲)线连接
    options.series 配置渲染项如 {type: "line", smooth: true, lineStyle: {color: "green"}},其中 smooth 即控制平滑绘制

  • 柱形图渐变色方向
    渐变色 new echarts.graphic.LinearGradient(x: number, y: number, x2: number, y2: number...) 其中 x, y... 即为配置项,配置为 (0, 0, 1, 0) 即可

  • 柱形象形图(阿里data-v里成为斑马图)实现
    具体搜索 echarts pictorialBar 即可

  • 地图与柱形图联动,动画不显示问题
    不要给数据设置id,series对象id要对应

posted @ 2021-09-16 16:43  彼时今日  阅读(63)  评论(0编辑  收藏  举报