<!DOCTYPE html><html><head><meta charset="utf-8"><title>第一个 ECharts 实例</title><!-- 引入 echarts.js --><script src="/echarts/4.3.0/echarts.min.js"></script></head><body><!-- 为ECharts准备一个具备大小(宽高)的Dom --><div id="main" style="width: 800px;height:600px;"></div><script type="text/javascript">// 基于准备好的dom,初始化echarts实例var myChart = echarts.init(document.getElementById('main'));// 指定图表的配置项和数据var option = {tooltip: {// trigger: 'axis',axisPointer: {type: 'shadow'}},legend: {data:['3-11岁任务数','3-11岁全程接种量','60岁任务数','60岁全程接种量','80岁任务数','80岁全程接种量','完成率']},grid: {left: '3%',right: '4%',bottom: '3%',containLabel: true},xAxis: [{type: 'category',data: ['街道1', '街道2', '街道3', '街道4', '街道5', '街道6', '街道7']}],yAxis: [{}, {max: 180,min: 0,interval: 180 / 6,splitLine: {show: true,lineStyle: {type: 'dashed',color: "#d1d1e0"}},}],series: [{name: '3-11岁任务数',type: 'bar',// emphasis: {// focus: 'series'// },data: [150, 230, 224, 218, 135, 147, 260],stack:"x"},{name: '3-11岁全程接种量',type: 'bar',data: [150, 230, 224, 218, 135, 147, 260],stack:"x"},{name: '60岁任务数',type: 'bar',data: [150, 230, 224, 218, 135, 147, 260],stack:"y"},{name: '60岁全程接种量',type: 'bar',data: [880, 30, 124, 118, 35, 47, 160],stack:"y"},{name: '80岁任务数',type: 'bar',data: [660, 30, 124, 118, 35, 47, 160],stack:"z"},{name: '80岁全程接种量',type: 'bar',data: [880, 30, 124, 118, 35, 47, 160],stack:"z",},{name: '完成率',type: 'line',data: [50, 130, 124, 18, 35, 47, 160],markLine: {data: [{type: 'average',name: '平均值'}]},yAxisIndex: 1,}]};// 使用刚指定的配置项和数据显示图表。myChart.setOption(option);</script></body></html>
200字范文,内容丰富有趣,生活中的好帮手!