dataView: {
              show: true,
              readOnly: true,
              optionToContent: function (opt) {
      // console.log(opt) 
                //该函数可以自定义列表为table,opt是给我们提供的原始数据的obj。 可打印出来数据结构查看
                var axisData = opt.xAxis[0].data; //坐标轴
                var series = opt.series; //折线图的数据
                var tdHeads =
                  '<td  style="margin-top:10px; padding: 0 15px">日期</td>'; //表头
                var tdBodys = "";
                series.forEach(function (item) {
                  tdHeads += `<td style="padding:5px 15px">${item.name}</td>`;
                });
                var table = `<table border="1" style="margin-left:20px;border-collapse:collapse;font-size:14px;text-align:center"><tbody><tr>${tdHeads} </tr>`;
                for (var i = 0, l = axisData.length; i < l; i++) {
                  for (var j = 0; j < series.length; j++) {
                    if (series[j].data[i] == undefined) {
                      tdBodys += `<td>${"-"}</td>`;
                    } else {
                      tdBodys += `<td>${series[j].data[i]}</td>`;
                    }
                  }
                  table += `<tr><td style="padding: 0 15px">${axisData[i]}</td>${tdBodys}</tr>`;
                  tdBodys = "";
                }
                table += "</tbody></table>";
                return table;
              },
              contentToOption: function (HTMLDomElement, opt) {
                return opt;
              },
            },

echarts中折线图切换为数据视图(表格布局)表头无法对齐解决方法的更多相关文章

  1. echarts 中 柱图 、折线图、柱图层叠

    app.title = '折柱混合'; option = { tooltip: { trigger: 'axis', axisPointer: { type: 'cross', crossStyle: ...

  2. Echarts中太阳图(Sunburst)的实例

    Echarts中太阳图(Sunburst)的实例 目前在项目中要实现一个Echars中的太阳图,但是Echars中的太阳图的数据格式是一个树形结构,如下代码格式如下: var mapData = [ ...

  3. "ORA-00942: 表或视图不存在 "的原因和解决方法

    "ORA-00942: 表或视图不存在 "的原因和解决方法   采用Oracle数据库,使用Powerdesigner设计,生成Sql文件导入后查询出现“ORA-00942: 表或 ...

  4. extjs folder is lost解决方法 和 FineUI主题切换时 iframe内的内容主题不变的解决方法

    错误原因:extjs包和FineUI版本不一致 或者是 webconfig配置中 没有设置为任何人可访问  解放方法下载和FineUI版本相同的extjs包就ok了 解决方法:FineUI主题切换时 ...

  5. 在Eclipse中运行Jboss时出现java.lang.OutOfMemoryError:PermGen space及其解决方法

    在Eclipse中运行Jboss时出现java.lang.OutOfMemoryError:PermGen space及其解决方法 在Eclipse中运行Jboss时,时间太长可能有时候会出现java ...

  6. ckfinder在IE10,IE9中的弹出框不能选择,或者不能上传解决方法

    在IE9,或IE10中ckfinder在IE10,IE9中的弹出框不能选择,或者不能上传解决方法   把弹出框嵌入到jquery dialog中.可以解决 I did: // javascript f ...

  7. ZCGL大数据平台日常运维问题与解决方法

    问题:HBase停止 解决方法:重新启动HBase,如下所示 表层问题:插入和查询HBase速度比较慢 排查一,查看HBase节点状态,发现正常运行: 排查二,查看访问HBase服务的状态,发现服务停 ...

  8. eCharts 折线图,动态绑定数据不更新图表的问题,

    官方文档 : http://echarts.baidu.com/tutorial.html npm install echarts --save let lineChart = echarts.ini ...

  9. Echarts使用及动态加载图表数据 折线图X轴数据动态加载

    Echarts简介 echarts,缩写来自Enterprise Charts,商业级数据图表,一个纯JavaScript的图表库,来自百度...我想应该够简洁了 使用Echarts 目前,就官网的文 ...

随机推荐

  1. Deep Models Under the GAN: Information Leakage from Collaborative Deep Learning

    郑重声明:原文参见标题,如有侵权,请联系作者,将会撤销发布! arXiv:1702.07464v3 [cs.CR] 14 Sep 2017 以下是对本文关键部分的摘抄翻译,详情请参见原文. ABSTR ...

  2. 将Darknet编译成API形式的so文件

    Makefile: GPU= CUDNN= OPENCV= OPENMP= DEBUG= ARCH= -gencode arch=compute_30,code=sm_30 \ -gencode ar ...

  3. spss如何把多个指标合并成一个变量?

    把多个指标合并成一个变量,通常有两种做法: 一.计算平均值 针对问卷量表数据,同时几个题表示一个维度.比如想要将“我在工作中能获得成就感”.“我可以在工作中发挥个人的才能”这两题合并成一个维度(影响因 ...

  4. 模型层中QuerySet的学习

    创建对象 使用关键字参数实例化模型实例来创建一个对象,然后调用save()把它保存到数据库中 pub_obj = models.Publisher(title='奥利给出版社') pub_obj.sa ...

  5. Java学习笔记——java基础

    2020.9.1 学习来自 https://www.liaoxuefeng.com/wiki/1252599548343744/1255883729079552 一.变量和数据类型 基本数据类型 基本 ...

  6. .Net Task 异步执行不等待结果返回

    该文章适合有一定异步编程基础的童鞋 开始之前先看.NET官网的一张图: 异步编程中最需弄清的是控制流是如何从方法移动到方法的. 没有理解的话可以去看一下 https://docs.microsoft. ...

  7. 长沙做假证u

    长沙做假证[电/薇:187ヘ1184ヘ0909同号]办各类证件-办毕业证-办离婚证,办学位证书,办硕士毕业证,办理文凭学历,办资格证,办房产证不. 这是一个简单的取最大值程序,可以用于处理 i32 数 ...

  8. Fitness - 07.07

    倒计时177天 运动53分钟,共计8组半,5.5公里.拉伸5分钟. 每组跑步5分钟(6.5KM/h),走路1分钟(5.5KM/h). 感冒+姨妈耽搁了大半月的时间 终于进入第六周的训练了~~!加油~! ...

  9. unity坑-编译错误

    问题: 项目里面有一个 StreamReader来读取一个文件,使用OpenText() 方法. 但是UNITY却提示 StreamReader类不包含OpenText()方法,并且也没有找到扩展方法 ...

  10. rpc中的注册中心

    使用模板模式,对注册中心进行设计,可以方便后续添加注册中心 模板抽象类,提供注册中心必要的方法. public abstract class ServiceRegistry { //这是一个模板的抽象 ...