Echart的简单例子

it2022-05-05  144

【转载自:http://echarts.baidu.com/echarts2/doc/start.html】

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%><!DOCTYPE html><head>   <meta charset="utf-8">   <title>ECharts</title></head><body>   <!-- 为ECharts准备一个具备大小(宽高)的Dom -->   <div id="main" style="height:400px"></div>   <!-- ECharts单文件引入 -->   <script src="${pageContext.request.contextPath}/lib/echart/dist/echarts.js"></script>   <script type="text/javascript">   // 路径配置     require.config({     paths: {     echarts: '${pageContext.request.contextPath}/lib/echart/dist'       }     }); // 使用 require( [   'echarts',   'echarts/chart/bar' // 使用柱状图就加载bar模块,按需加载 ], function (ec) {   // 基于准备好的dom,初始化echarts图表   var myChart = ec.init(document.getElementById('main'));   var option = {   //提示   tooltip: {     show: true   },   //图例   legend: {     data:['销量']   },   //X轴   xAxis : [   {     type : 'category',     data : ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]   }   ],   //Y轴   yAxis : [   {     type : 'value'   }], series : [{   "name":"销量",   "type":"bar",   "data":[5, 20, 40, 10, 10, 20] }] };   // 为echarts对象加载数据   myChart.setOption(option);   } ); </script></body>

转载于:https://www.cnblogs.com/Lxiaojiang/p/6180168.html


最新回复(0)