ECharts-概貌

2022-07-20 13:31:54 阅读：200 来源： 互联网

标签：bar 概貌 0.3 dataset color offset type ECharts

option = {

backgroundColor: {//背景颜色

//样式
　　　　type: 'radial',
　　　　x: 0.3,
　　　　y: 0.3,
　　　　r: 0.8,
colorStops: [
　　　　{
　　　　offset: 0,
　　　　color: '#f7f8fa'
　　　　},
　　　　{
　　　　offset: 1,
　　　　color: '#cdd0d5'
　　　　}
　　　　]
},
grid: {//栅栏布局
　　　　left: 20,
　　　　containLabel: true,
　　　　bottom: 20,
　　　　top: 10,
　　　　right: 30
},

legend: {//图例},

tooltip: {事件},

dataset: {

/////数据集
    // 提供一份数据。
    source: [
      ['product', '2015', '2016', '2017'],
      ['Matcha Latte', 43.3, 85.8, 93.7],
      ['Milk Tea', 83.1, 73.4, 55.1],
      ['Cheese Cocoa', 86.4, 65.2, 82.5],
      ['Walnut Brownie', 72.4, 53.9, 39.1]
    ],
    {
      // 这个 dataset 的 index 是 `3`。
      transform: {// transform 进行数据转换
        type: 'filter',
        config: { dimension: 'Year', value: 2013 }
      }
    }
  },
  // 声明一个 X 轴，类目轴（category）。默认情况下，类目轴对应到 dataset 第一列。

xAxis: { type: 'category' },
  // 声明一个 Y 轴，数值轴。

yAxis: {

　　　　splitLine: {//拼合线

　　　　show: false
},
scale: true

},
  // 声明多个 bar 系列，默认情况下，每个系列会自动对应到 dataset 的每一列。
series: [//数据的视觉映射
{ type: 'bar' }, { type: 'bar' }, { type: 'bar' }
]

itemStyle: {//图形样式
　　　　shadowBlur: 10,
　　　　shadowColor: 'rgba(144, 36, 50, 0.5)',
　　　　shadowOffsetY: 5,
　　　　color: {
　　　　type: 'radial',
　　　　x: 0.4,
　　　　y: 0.3,
　　　　r: 1,
　　　　colorStops: [
　　　　{
　　　　offset: 0,
　　　　color: 'rgb(251, 118, 123)'
　　　　},
　　　　{
　　　　offset: 1,
　　　　color: 'rgb(204, 46, 72)'
　　　　}
　　　　]
}

};

标签：bar,概貌,0.3,dataset,color,offset,type,ECharts
来源： https://www.cnblogs.com/origin-zy/p/16497624.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

ECharts-概貌