图表类型，必要参数！如为空或不支持类型，则该系列数据不被显示。可选为：

'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>重点模块访问数据统计&nbsp;&nbsp;&nbsp;[系统总登录次数：<span style="color:green;">${xtdl}</span>]</b>

    </form:form>

     <!-- 为ECharts准备一个具备大小（宽高）的Dom -->

    <div id="main" style="height:600px;"></div>

</body>

</html>

Echarts饼图显示模板的更多相关文章

  1. echarts饼图配置模板

    var option = { title:{ text:'完成人构成分析--申报', //标题的样式 textSytle:{ //颜色 color : '#FF0000', //粗细 // fontW ...

  2. ajax导致Echarts不显示饼图数据、柱状图数据只显示气泡的问题。

    1.ajax导致Echarts不显示饼图数据.柱状图数据只显示气泡的问题. ajax的同步.这个同步的意思是当JS代码加载到当前ajax的时候会把页面里所有的代码停止加载,页面出去假死状态,当这个aj ...

  3. SharePoint 2013 定制搜索显示模板（二）

    前言 之前一篇博客,简单的介绍了如何定制搜索显示模板,这一次,我们介绍一下如何定制搜索显示时,弹出来的那个页面,相信这个大家也都会遇到的. 1.第一部分就是搜索显示模板的部分,第二部分就是搜索项目详情 ...

  4. SharePoint 2013 定制搜索显示模板

    前言 之前我们已经介绍了一些关于搜索的相关配置,当然,用户关于搜索的要求可能是各种各样.有时候,用户会说,你们的显示结果太Low了,确实是:不过,在SharePoint中,我们可以很容易的定制搜索结果 ...

  5. ECharts饼图试玩

    处理类似提交问卷的数据,要生成图表,用了ECharts,好方便的. 简陋效果: 1.表单存储 有单选和多选题,单选直接存储各选项数字值,1,2,3,4...中一个:多选用|分隔存储选项值,如1|3,2 ...

  6. 将数据动态加载到Echarts饼图中

    需求描述 Echarts中的官方示例是将数据的设定写好在页面的配置项中的,但在实际的开发展示中,我们需要按照需求通过调用后台的接口获取数据,再将数据加载到特定的Echarts饼图中. 实现效果 实现步 ...

  7. echarts报表显示%+没有0

    function showTablegroup(page) { var series; $.ajax({ type:'post', url:"<%=basePath%>flowA ...

  8. zabbix3.4.7版本饼图显示问题

    问题描述 最近使用zabbix3.4.7版本,发现监控Linux的主机关联系统自带的Template OS Linux模版之后,磁盘空间饼图显示有问题,出现空白,如图所示 查看之后,确定为自带的Lem ...

  9. Sharepoint2013搜索学习笔记之自定义结果显示模板(九)

    搜索结果通过套用定义好的显示模板来展示结果,显示模板由js和html组成,我们可以通过修改显示模板,然后将修改好的显示模板跟搜索结果绑定起来,来修改搜索结果的显示效果,例子如下图: 修改前 修改后 第 ...

随机推荐

  1. H5外部浏览器直接调起微信——通过url协议 weixin:// 判断是否安装微信及启动微信

    前言: h5分享到微信,h5使用微信支付这些功能,都需要先判断是否安装微信客户端,如果已安装就启动微信,如果没有安装微信,就提示用户前去安装. 我们可以通过访问微信提供的URL协议(weixin:// ...

  2. Windows如何安装Android SDK

    我们都知道App测试分为Android和IOS两种客户端,当我们测试Android版本的App的时候经常要安装Android环境,那么安装Android SDK 就是必不可少的,接下来我们就来看看如何 ...

  3. day 11 生成器

    生成器生成器本质就是迭代器,生成器是自己用python代码写的迭代器 将函数变成生成器yield用next 取值一个next,对应一个yield def func(): yield 111 yield ...

  4. HTML基础学习笔记（2）

    HTML学习笔记(2) 1 head标签中的结构 编码结构:<meta charset="UTF-8"> charset---编码 ascll ansi Unicode ...

  5. 关于界面绘制过程多次回调ondraw()方法产生的问题

    最近项目中,出现一个问题,要做成的效果是这样的,但是一进去就变成这样了, 后来发现,刚进去是正常的,一闪而过,就变成全部了. 界面绘制过程,ondraw() 会被多次回调. 就是说在第一次绘制的时候是 ...

  6. php解析优酷网上的视频资源去广告

    1.过程原理解析: 一.准备工作 所谓工欲善其事必先利其器,做好破解的准备工作会令你事半功倍. 1.首先准备一个Http抓包工具,PC上推荐Fiddler或者Postman,iOS上推荐Surge 2 ...

  7. 移动端meta行大全

    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable= ...

  8. WEB框架之Django实现分页功能

    一 Paginator分页器 1 首先在数据库中生成大量数据 def index(request) book_list = [] for i in rang(1000) book = Book(tit ...

  9. golang 实现延迟消息原理与方法

    实现延迟消息具体思路我是看的下面这篇文章 https://mp.weixin.qq.com/s/eDMV25YqCPYjxQG-dvqSqQ 实现延迟消息最主要的两个结构: 环形队列:通过golang ...

  10. html5的离线缓存

    一个离线网络应用程序就是一个URL的列表,html,css,js,图片,或者其他类型的资源. 把这些资源,在本地缓存下来,当你尝试在没有网络连接时访问网络应用程序,你的浏览器将自动切换并使用本地代替. ...