echarts 常用配置

最新推荐文章于 2024-06-20 09:30:03 发布

wwlx_

最新推荐文章于 2024-06-20 09:30:03 发布

阅读量141

点赞数

文章标签： echarts 前端 javascript

本文链接：https://blog.csdn.net/qq_42768522/article/details/130578438

版权

提示框组件 tooltip

formatter 提示框浮层

axisPointer 坐标轴指示器

xAxis，yAxis

axisLine 坐标轴轴线

axisLabel 坐标轴刻度标签

axisTick 坐标轴刻度

splitLine 坐标轴在gird区域中的分隔线

series

折线图 areaStyle 区域填充样式

areaStyle: {
  // 渐变
  color: {
    type: 'linear',
    x: 0,
    y: 0,
    x2: 0,
    y2: 1,
    colorStops: [{
      offset: 0, color: 'rgba(37,119,227,0.4)' // 0% 处的颜色
    }, {
      offset: 1, color: 'rgba(37,119,227,0)' // 100% 处的颜色
    }],
    global: false
  }
}

legend 图例组件

词云图

myChart.setOption({
        series: [{
          type: 'wordCloud',
          keepAspect: false,
          left: 'center',
          top: 'center',
          width: '100%',
          height: '100%',
          right: null,
          bottom: null,
          // 词的大小，最小12px，最大60px，可以在这个范围调整词的大小
          // sizeRange: [12, 21],
          // 每个词旋转的角度范围和旋转的步进
          rotationRange: [0, 0],
          // rotationStep: 200,
          // 词间距，数值越小，间距越小，这里间距太小的话，会出现大词把小词套住的情况，比如一个大的口字，中间会有比较大的空隙，这时候他会把一些很小的字放在口字里面，这样的话，鼠标就无法选中里面的那个小字，这里可以用函数根据词云的数量动态返回间距
          gridSize: 30,
          // 允许词太大的时候，超出画布的范围
          drawOutOfBound: false,
          // 布局的时候是否有动画
          layoutAnimation: true,
          emphasis: {
            focus: 'self',
            textStyle: {
              textShadowBlur: 10,
              textShadowColor: '#333'
            }
          },

          data: [] //数据
        }]
      })