toolbox : {
show : true,
feature : {
dataView : {
optionToContent : function(option) {
// 行名称
var axisData = option.xAxis[0].data;
// 列名称
var header = option.legend[0].data;
var seriesarr = option.series;
var eldiv = '<div id="viewdata" style="width:100%;display:block;margin-left:85px;overflow:auto;">';
var firsttd = '<td></td>';
var table = '<table style="width:100%;text-align:left;overflow:scroll;"><tbody>'
+ '<tr>'
if (header != undefined) {
for (var i = 0; i < header.length; i++) {
firsttd += '<td>' + header[i] + '</td>'
}
} else {
table = '<table style="width:50%;text-align:left;overflow:scroll;"><tbody>';
for (var i = 0; i < 1; i++) {
firsttd += '<td>' + "分数" + '</td>'
}
}
// 表格列头拼装完毕
table += firsttd + '</tr>';
// 表格行头拼装完毕
for (var i = 0, l = axisData.length; i < l; i++) {
table += '<tr>' + '<td>' + axisData[i] + '</td>'
for (var j = 0; j < seriesarr.length; j++) {
table += '<td>' + seriesarr[j].data[i]
+ '</td>'

}
}
table += "</tr>";
table += '</tbody></table>';
return eldiv + table + "</div>";
}
},
magicType : {
show : true,
type : [ 'line', 'bar' ]
},
restore : {
show : true
},
saveAsImage : {
show : true
}
}
},

Echarts 自定义数据视图的更多相关文章

  1. echarts优化数据视图dataView中的样式

    在使用echart过程中,toolbox里有个dataView视图模式,里面的数据没有对整,影响展示效果,情形如下:改问题解决方案为,在optionTocontent回调函数中处理,具体代码如下: t ...

  2. echarts给数据视图添加表格样式

    1,准备好样式 <style>.myTable {margin: 0 auto;/* height: 300px; */width: 700px;} .myTitle {backgroun ...

  3. Echarts 数据视图 生成Excel的方法

    一.生成Excel,两大方向:1后台生成Excel 查询数据库,使用NOPI生成Excel.2前台js生成Excel三种方式1)jquery.table2excel.js --采用,优势:兼容IE和C ...

  4. ECharts – 大数据时代,重新定义数据图表

    ECharts 基于 Canvas 的纯 Javascript 图表库,提供直观,生动,可交互,可个性化定制的数据可视化图表.创新的拖拽重计算.数据视图.值域漫游等特性大大增强了用户体验,赋予了用户对 ...

  5. echarts如何修改数据视图dataView中的样式

    原文链接:点我 做了一个现实折线图的图表,通过右上角icon可以自由切换成柱状图,表格.在表格中遇到的一点小问题,解决方案如下: 1.场景重现 这是一个显示两个折线图的图表,一切看起来都很顺利.但是点 ...

  6. Echarts 地图(map)插件之 鼠标HOVER和tooltip自定义数据

    在项目开发中,有需要用到地图的地方,百度的echarts地图插件就是个不错的选择, 这里总结一下地图自定义鼠标HOVER时的事件和自定义tooltip数据: 一.鼠标HOVER时的事件: 参照官方文档 ...

  7. SharePoint开发 - Excel数据导入到SharePoint自定义列表(数据视图方式)

    博客地址 http://blog.csdn.net/foxdave 本篇讲解一个有些新颖的SharePoint实例应用,给甲方做过项目的都有过体会,数据太多了,客户有Excel,要求实现批量导入. 效 ...

  8. echarts 显示下载按钮,echarts 自定义按钮,echarts 添加按钮

    echarts 显示下载按钮,echarts 自定义按钮,echarts 添加按钮 >>>>>>>>>>>>>>&g ...

  9. Datazen地图Chart自定义数据

    此篇介绍如何将数据关联到Datazen地图图表.我们会将数据库中的数据映射到地图上. 首先查看下默认地图图表绑定的数据.以下是系统自带的美国地图数据,主要有两列,一列为地名,一列为度量数据.地图会根据 ...

随机推荐

  1. MS4W安装教程

    简介 欢迎使用MS4W,这是由Gateway Geomatics开发的快速简便的安装程序,用于为Windows及其附带应用程序(如Geomoose.MapBender.Openlayers等)设置Ma ...

  2. 【数据库】一篇文章搞掂:Oracle数据库

    PL/SQL的使用 1.安装使用 1.1.安装暂略 1.2.使用 添加环境变量 打开PL/SQL,不要登录,进入界面后,打开设置Preference 设置主目录和OCI库

  3. HDU 5952 Counting Cliques(dfs)

    Counting Cliques Time Limit: 8000/4000 MS (Java/Others)    Memory Limit: 65536/65536 K (Java/Others) ...

  4. 心形陀螺案例css3

    <!DOCTYPE html><html lang="zh-cn"><head> <meta charset="UTF-8&qu ...

  5. Java-package import关键字

    package包关键字,在java中,有包的概念,主要是用来归类 分类作用: 便于项目的开发和维护: 通过分包,可以很清晰的来管理类: 上述 一个类Animal: 在开头有个 package com. ...

  6. WingIIDE 6的licese破解方法(支持python3)

    (1) 安装WingIDE成功后启动,激活时输入license id CN123-12345-12345-12345 (2)点击Continue后弹框,拷贝框中的request code(将其放入脚本 ...

  7. php中数组的指针

    利用PHP内置的函数 key() 获得键. current()获得值, next(); prev();移动到上一个 reset();//重置,移动到第一个元素 end();//移动到最后一个元素上 注 ...

  8. 动态规划-递推-HDU2048

    传送门:http://acm.hdu.edu.cn/showproblem.php?pid=2048 全错=全不匹配 设当前全错的个数是dp[n] 那么前(n-1)个全错的话,第n个数就可以从前(n- ...

  9. JS对像和数组的遍历

    零. 通用遍历方法 0.1 for...in... let obj = {0:"a", 1:"b", 2:"c"}; for (let ke ...

  10. Codeforces 1082G(最大权闭合子图)

    题面 传送门 分析 没想到压轴题是道模板裸题 由于子图的权值=边权和-点权和 将边和点都看成新图中的点 S向原来的边i连边,权值为边权 点i向T连边,权值为点权 边i:(u,v,w)向u,v,连边,权 ...