echarts笔记
常见问题:
1.x轴和y轴type同时为category时不可行
只能改变方式显示,返回不同名称,如加上百分比显示 formatter:"value%";
var waterLevel = ["", "Ⅰ", "Ⅱ", "Ⅲ", "Ⅳ", "Ⅴ", "劣Ⅴ"];
yAxis: [
{
type: 'value',
interval: true,
max: 6,
axisLabel: {
formatter: function (params) {
return waterLevel[params];
}
},
data: waterLevel
}
],
2.当存放图表的Div为隐藏时,无法加载图表(需要设置好高度)
3.主题加载
echart3加载主题
//先引用js包(如2.0版)<script src="/echarts/themes/macarons.js" type="text/javascript"></script>
echarts.registerTheme("macarons", theme);
var domChart1 = document.getElementById("Chart1");
var myChar = echarts.init(domChart1, "macarons");
echart2加载主题
require.config({
paths: {
'echarts': '/UILib/echarts'
}
});
// 使用【柱状图】
require(
[
'echarts',
'echarts/themes/2.2.7/macarons',
'echarts/chart/line',
'echarts/chart/bar' // 使用柱状图就加载bar模块,按需加载
],
function (ec, theme) {
// 基于准备好的dom,初始化echarts图表
myChart = ec.init(document.getElementById('Chart1'), theme);
})
4.echarts3绑定事件
myChart.on("click", fcShowInfo);
function fcShowInfo(param) {}
百度echarts案例下载
http://echarts.baidu.com/gallery/editor.html?c=effectScatter-map
effectScatter-map是案例名称,如http://echarts.baidu.com/demo.html#lines-bmap-bus
echarts笔记的更多相关文章
- Echarts笔记——使用AJAX填充数据
最近把编辑器从Sublime换成HBuilder,感觉好用很多啊,可能自己插件没弄好吧.不不过HBuilder的启动速度确实慢,放机械盘启动要7-13秒,还好有固态. 因为项目需要,这周上手了百度的E ...
- Echarts的一些总结
Echarts是专注做统计图表的插件,其本质是使用canvas进行图表的绘制.而如今它的属性和配置也是越来越丰富.基本的配置很简单,比如饼状图,就是数据和要显示的文字和颜色,柱状图,就是横纵坐标和数据 ...
- vue中添加Echarts图表的使用,Echarts的学习笔记
项目中需要使用一些折线图.柱状图.饼状图等等,之前使用过heightCharts(关于heightCharts请看我的另一篇 http://www.cnblogs.com/jasonwang2y60/ ...
- echarts学习笔记(一)
echarts学习笔记(一) echarts开发步骤 创建一个新的html文件 在html文件head头部信息中导入echarts 声明一个容器(可以理解为画布),用于存放echarts 实例化ech ...
- Echarts学习笔记之饼图
注:ECHarts的相关文件请到ECharts官网下载,下载地址:http://echarts.baidu.com/download.html 1.前台 <div style="ali ...
- web前端开发控件学习笔记之jqgrid+ztree+echarts
版权声明:本文为博主原创文章,转载请注明出处. 作为web前端初学者,今天要记录的是三个控件的使用心得,分别是表格控件jqgrid,树形控件ztree,图表控件echarts.下边分别进行描述. ...
- echarts演示笔记
http://echarts.baidu.com/doc/start.html 1.新建一个echarts.html文件,为ECharts准备一个具备大小(宽高)的Dom. <!DOCTYPE ...
- 学习笔记-echarts自定义背景图片
困扰我已久的问题就解决了. code: //使用canvas把背景添加到echarts里 var img = new Image();var canvas = document.createEleme ...
- 学习笔记-echarts点击数据添加跳转链接
原链接:http://echarts.baidu.com/demo.html#pie-rich-text 这个一段官方提供的实例. var weatherIcons = { 'Sunny': './d ...
随机推荐
- scp远程拷贝文件及文件夹
scp : 远程copy 命令 -r : 递归copy 从Linux Copy 到 Linux 从Linux Copy 到 Windows (当前目录使用. 就可以了) scp -r root@10. ...
- springboot 定时任务
1.启动类新增注解 @EnableScheduling import org.springframework.boot.SpringApplication; import org.springfram ...
- Linux 压缩某个文件夹命令
tar -zcvf /home/xahot.tar.gz /xahot tar -zcvf 打包后生成的文件名全路径 要打包的目录 例子:把/xahot文件夹打包后生成一个/home/xahot.ta ...
- AppCan移动开发技巧:3步走,获取移动APP签名信息
大家知道,在移动APP开发里,与应用包名一样,应用的签名信息需是唯一的,否则将会出现应用冒领.重复安装等问题.之前分享过安卓应用的签名如何获取(点击查看),这里将继续以AppCan平台为例,分享如何获 ...
- php解决微信文章图片防盗链
解决微信文章图片防盗链 function actionWechatImg() { header('Content-type: image/jpg'); $url = $_GET['url']; $re ...
- 使用Builder模式创建复杂可选参数对象
在新建对象时,若需要对大量可选参数进行赋值,最常见的做法是JavaBeans模式,即调用一个无参构造方法创建对象,然后调用setter方法来设置每个必要的参数,以及每个相关的可选参数.代码示例如下: ...
- 身份认证功能chiro的使用
package com.cun;import org.apache.shiro.SecurityUtils;import org.apache.shiro.authc.*;import org.apa ...
- LODOP获取打印成功,是否加入队列
之前博文介绍过获取打印机状态码 LODOP获取打印机状态码和状态码含义测试,但是打印机种类千差万别,状态码不一定准确,特别是打印成功的状态码,获取任务不在队列,可以判断打印成功,删除任务也是任务不在队 ...
- sts 创建springMVC项目---- maven和tomcat 错误处理
今天学习spring的时候,学到了springMVC, 因为springMVC 就是beginning spring 书籍的第三章,为了更深入或更简单的起步学习springMVC, 我又找了另外一本书 ...
- Hadoop系列(三):hadoop基本测试
下面是对hadoop的一些基本测试示例 Hadoop自带测试类简单使用 这个测试类名叫做 hadoop-mapreduce-client-jobclient.jar,位置在 hadoop/share/ ...