Echarts饼图显示模板
Posted Mr yu
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了Echarts饼图显示模板相关的知识，希望对你有一定的参考价值。
图表类型，必要参数！如为空或不支持类型，则该系列数据不被显示。可选为：
‘line‘（折线图） | ‘bar‘（柱状图） | ‘scatter‘（散点图） | ‘k‘（K线图）
‘pie‘（饼图） | ‘radar‘（雷达图） | ‘chord‘（和弦图） | ‘force‘（力导向布局图） | ‘map‘（地图）
饼图：‘echarts/chart/pie‘ // 使用柱状图就加载bar模块，按需加载，记得改pie
柱状图：‘echarts/chart/bar‘
<%@ page contentType="text/html;charset=UTF-8" %> <%@ include file="/WEB-INF/views/include/taglib.jsp"%> <%@ page language="java" import="java.util.*,java.lang.*" pageEncoding="UTF-8"%> <html> <head> <title>日志管理</title> <meta name="decorator" content="default"/> <meta charset="utf-8"> <!-- ECharts单文件引入 --> <!-- <script src="http://echarts.baidu.com/build/dist/echarts.js"></script> --> <script src="${ctxStatic }/js/echarts.js"></script> <script type="text/javascript"> // 路径配置 require.config({ paths: { echarts: ‘http://echarts.baidu.com/build/dist‘ } }); // 使用 require( [ ‘echarts‘, ‘echarts/chart/pie‘ // 使用柱状图就加载bar模块，按需加载 ], function (ec) { // 基于准备好的dom，初始化echarts图表 var myChart = ec.init(document.getElementById(‘main‘)); option =替换部分 // 为echarts对象加载数据 myChart.setOption(option); } ); </script> </head> <body> <ul class="nav nav-tabs"> <li ><a href="${ctx}/sys/log/list">日志列表</a></li> <li class="active"><a href="${ctx}/sys/log/view"><b>日志视图</b></a></li> </ul> <form:form id="searchForm" modelAttribute="bean" action="${ctx}/sys/log/view" method="post" class="breadcrumb form-search"> <b>重点模块访问数据统计 [系统总登录次数：<span style="color:green;">${xtdl}</span>]</b> </form:form> <!-- 为ECharts准备一个具备大小（宽高）的Dom --> <div id="main" style="height:600px;"></div> </body> </html>
以上是关于Echarts饼图显示模板的主要内容，如果未能解决你的问题，请参考以下文章