前言

上周在厌烦Highchart下,体验了下百度的eCharts,支持IE6、7、8+外,对数据在线编辑还有工具栏支持,体验时遇到了几个小问题,最近两天在尝试得到了一个解决方法。

Tooltip时单位问题

在Tooltip里使用formatter解决,设置函数相对复杂些,因为要根据你的Series取值设置,就像一个多维数组一样。 在支持汉字的同时也支持上下标如10<sup>4</sup>t。

tooltip: {
trigger: 'axis',
axisPointer: { // 坐标轴指示器,坐标轴触发有效
type: 'shadow' // 默认为直线,可选为:'line' | 'shadow'
},
formatter: function (param){
return param[0][1] + '<br/>'
+ param[0][0] + ' : ' + (param[0][2]+' 万吨') + '<br/>'
+ param[1][0] + ' : ' + (param[1][2]+' 万吨')+'<br/>'
+ param[2][0] + ' : ' + (param[2][2]+' 万吨')+'<br/>';
}
}

柱状图圆角

当然了,在查看官方Demo时大部分例子都已经是圆角。 我在查阅资料时有朋友推荐使用chart.setTheme方法,使用官方的主题,这个我没搞通,我是设置series的itemStyle属性,其中包含属性barBorderRadious。

series: [
{
name: '预测',
type: 'bar',
itemStyle: {
normal: {
color:'#fff',
barBorderColor: 'tomato',
barBorderWidth: 6,
barBorderRadius:5,
}
},
data: arr2
}]

初次体验百度eCharts遇到的问题和解决方法的更多相关文章

  1. 在bootstrap modal 中加载百度地图的信息窗口失效解决方法

    这个问题其实很傻,解决方法没有任何技术含量,只是记录下工作中发生的事. 前阵子给一个汽车集团客户做了一个经销商查询系统,其中一个功能是使用地图标注经销商店面地址,并且实现导航功能. 页面演示地址:ht ...

  2. echarts移动端字体模糊解决方法

    echarts使用canvas画图,在移动端使用rem时候,若viewport的scale被缩放,则字体会发生模糊,本人采用的解决方法是在不同的dpr下使用不同的字体大小,具体代码如下: 获取字体大小 ...

  3. 百度编辑器不能插入html标签解决方法

    找到此方法: me.addInputRule(function (root) { var allowDivTransToP = this.options.allowDivTransToP; var v ...

  4. 百度MIP校验错误整理与解决方法

    MIP校验工具地址: https://www.mipengine.org/validator/validate 1.强制性标签缺失或错误 错误提示:line 1,col 1: 强制性标签'<sc ...

  5. 网页图表类框架(插件)——百度eCharts和Highcharts

    ECharts, 缩写来自Enterprise Charts,商业级数据图表,一个纯Javascript的图表库, 可以流畅的运行在PC和移动设备上,兼容当前绝大部分浏览器(IE6/7/8/9 /10 ...

  6. 百度echarts可以做什么

    百度echarts可以做什么 一.总结 一句话总结:可视化做的很好,各种图都有.而且支持动态数据. 二.百度eCharts体验 前言 从昨天开始给项目里添加一些图表对比功能,上一个项目里使用的是Hig ...

  7. 令人惊叹的百度Echarts,大数据分析的必备工具

    学习目录 1.可视化面板介绍     1.1技术要点     1.2案例适配方案     1.3页面主体布局2.Echarts(重点)     2.1echarts介绍     2.2echarts体 ...

  8. WPF仿百度Echarts人口迁移图

    GitHub地址:https://github.com/ptddqr/wpf-echarts-map/tree/master 关于大名鼎鼎的百度Echarts我就不多说了 不了解的朋友直接看官方的例子 ...

  9. C#+JQuery+.Ashx+百度Echarts实现全国省市地图和饼状图动态数据图形报表的统计

    在目前的一个项目中,需要用到报表表现数据,这些数据有多个维度,需要同时表现出来,同时可能会有大量数据呈现的需求,经过几轮挑选,最终选择了百度的echarts作为报表基础类库.echarts功能强大,界 ...

随机推荐

  1. sql编程(四)触发器

    触发器:一种特殊的存储过程,和制定的表相关,而对于一个表进行的数据操作时自动的触发执行类似winform 事件创建语法:create trigger 触发器的名称on 表名 for insert | ...

  2. js中的时间与毫秒数互相转换

    1.js毫秒时间转换成日期时间 var oldTime = (new Date("2012/12/25 20:11:11")).getTime(); //得到毫秒数     //不 ...

  3. Awstats显示国家地区插件GeoIP安装

    Awstats默认安装之后是不具有识别访问者的国家和地区信息的,所以需要安装插件支持Awstats列出访问者的国家和地区,便于分析GeoIP免费的是国家/IP的数据表,GeoIPCityLite是地区 ...

  4. 《R in Action》读书笔记(3) 数据变换

    MindMapper 原文件

  5. char varchar nchar nvarcharar到底有多大区别

    首先说明下,ASP.NET MVC系列还在龟速翻译中. 工作好多年,基础知识甚是薄弱,决定以后在coding(cv操作)的时候尽量多google下,然后总结下来,目的有三:     1. 加深自己的理 ...

  6. 使用C#给Linux写Shell脚本(下篇)

    在上篇的<使用C#给Linux写Shell脚本>结尾中,我们留下了一个关于C#如何调用BashShell的问题.在文章发布之后,我留意到有读者留言推荐使用“Pash”(一款类PowerSh ...

  7. js模版引擎handlebars.js实用教程——目录

    写在开头的话: 阅读本文需要了解基本的Handlebars.js概念,本文并不是Handlebars.js基础教程,而是注重于实际应用,为读者阐述使用过程中可能会遇到的一些问题. 实际上,小菜写这篇文 ...

  8. [CORS:跨域资源共享] W3C的CORS Specification

    随着Web开放的程度越来越高,通过浏览器跨域获取资源的需求已经变得非常普遍.在我看来,如果Web API不能针对浏览器提供跨域资源共享的能力,它甚至就不应该被称为Web API.从另一方面来看,浏览器 ...

  9. Android开发学习之路-LruCache使用和源码分析

    LruCache的Lru指的是LeastRecentlyUsed,也就是近期最少使用算法.也就是说,当我们进行缓存的时候,如果缓存满了,会先淘汰使用的最少的缓存对象. 为什么要用LruCache?其实 ...

  10. Redis命令笔记

    一.string类型:(1)set :设置key对应的值为string类型的value,例:set name helloworld(2)get :获取key对应的值为string类型的value,例: ...