0
点赞
收藏
分享

微信扫一扫

echarts有效应用

舟海君 2022-04-24 阅读 35
php

效果:

在这里插入图片描述
在这里插入图片描述

代码:

var dom = document.getElementById("container");
						var myChart = echarts.init(dom);
						var app = {};
						
						
						var option = {
						  tooltip: {
						    trigger: 'axis',
						    axisPointer: {
						      type: 'shadow' 
						    }
						  },
						  legend: {},
						  grid: {
						    left: '3%',
						    right: '4%',
						    bottom: '3%',
						    containLabel: true
						  },
						  title:{
						    text: 'CLOT鞋码销量榜'
						  },
						  xAxis: {
						    type: 'value',
						    axisLabel: {
						      formatter: '{value} 双'
						    }
						  },
						  yAxis: {
						    type: 'category',
						    data: ['7月', '8月', '9月', '10月', '11月', '12月']
						  },
						  series: [
						    {
						      name: '40',
						      type: 'bar',
						      stack: 'total',
						      label: {
						        show: true
						      },
						      emphasis: {
						        focus: 'series'
						      },
						      data: [532, 556, 448, 495, 536, 654, 645]
						    },
						    {
						      name: '41',
						      type: 'bar',
						      stack: 'total',
						      label: {
						        show: true
						      },
						      emphasis: {
						        focus: 'series'
						      },
						      data: [852, 985, 789, 886,896,782, 763]
						    },
						    {
						      name: '42',
						      type: 'bar',
						      stack: 'total',
						      label: {
						        show: true
						      },
						      emphasis: {
						        focus: 'series'
						      },
						      data: [2200, 1825, 1911, 2345, 2904, 3300, 3101]
						    },
						    {
						      name: '43',
						      type: 'bar',
						      stack: 'total',
						      label: {
						        show: true
						      },
						      emphasis: {
						        focus: 'series'
						      },
						      data: [1695, 2250, 2021, 1554, 2190, 1330, 2410]
						    },
						    {
						      name: '44',
						      type: 'bar',
						      stack: 'total',
						      label: {
						        show: true
						      },
						      emphasis: {
						        focus: 'series'
						      },
						      data: [820, 832, 901, 934, 965, 1001, 873]
						    }
						  ]
						};
						
举报

相关推荐

0 条评论