首页 > 代码库 > echarts HelloWord Demo

echarts HelloWord Demo

2024-07-27 13:20:37   220人阅读

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href=http://www.mamicode.com/"">
    
    <title>Echarts demo</title>
    
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">    

<script type="text/javascript">
    var option = {
       tooltip : {
           trigger: ‘axis‘
       },
       legend: {
           data:[‘蒸发量‘,‘降水量‘]
       },
       toolbox: {
           show : true,
           feature : {
               mark : {show: true},
               magicType : {show: true, type: [‘line‘, ‘bar‘]},
               restore : {show: true},
               saveAsImage : {show: true}
           }
       },
       calculable : true,
       xAxis : [
           {
               type : ‘category‘,
               data : [‘1月‘,‘2月‘,‘3月‘,‘4月‘,‘5月‘,‘6月‘,‘7月‘,‘8月‘,‘9月‘,‘10月‘,‘11月‘,‘12月‘]
           }
       ],
       yAxis : [
           {
               type : ‘value‘,
               splitArea : {show : true}
           }
       ],
       series : [
           {
               name:‘蒸发量‘,
               type:‘bar‘,
               data:[2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3]
           },
           {
               name:‘降水量‘,
               type:‘line‘,
               data:[2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3]
           }
       ]
   }
    </script>
</head>
<body>
     <div id="main" style="height:95%;border:1px solid #ccc;padding:10px;"></div>
</body>
    <script src=http://www.mamicode.com/"s_frontFrame/echarts-2.0.4/build/echarts-plain.js"></script>
<script type="text/javascript">
   var myChart = echarts.init(document.getElementById(‘main‘));
   myChart.setOption(option);
    </script>
</html>

echarts HelloWord Demo


联系
我们