常见问题:

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

effectScatter-map

echarts笔记的更多相关文章

  1. Echarts笔记——使用AJAX填充数据

    最近把编辑器从Sublime换成HBuilder,感觉好用很多啊,可能自己插件没弄好吧.不不过HBuilder的启动速度确实慢,放机械盘启动要7-13秒,还好有固态. 因为项目需要,这周上手了百度的E ...

  2. Echarts的一些总结

    Echarts是专注做统计图表的插件,其本质是使用canvas进行图表的绘制.而如今它的属性和配置也是越来越丰富.基本的配置很简单,比如饼状图,就是数据和要显示的文字和颜色,柱状图,就是横纵坐标和数据 ...

  3. vue中添加Echarts图表的使用,Echarts的学习笔记

    项目中需要使用一些折线图.柱状图.饼状图等等,之前使用过heightCharts(关于heightCharts请看我的另一篇 http://www.cnblogs.com/jasonwang2y60/ ...

  4. echarts学习笔记(一)

    echarts学习笔记(一) echarts开发步骤 创建一个新的html文件 在html文件head头部信息中导入echarts 声明一个容器(可以理解为画布),用于存放echarts 实例化ech ...

  5. Echarts学习笔记之饼图

    注:ECHarts的相关文件请到ECharts官网下载,下载地址:http://echarts.baidu.com/download.html 1.前台 <div style="ali ...

  6. web前端开发控件学习笔记之jqgrid+ztree+echarts

    版权声明:本文为博主原创文章,转载请注明出处.   作为web前端初学者,今天要记录的是三个控件的使用心得,分别是表格控件jqgrid,树形控件ztree,图表控件echarts.下边分别进行描述. ...

  7. echarts演示笔记

    http://echarts.baidu.com/doc/start.html 1.新建一个echarts.html文件,为ECharts准备一个具备大小(宽高)的Dom. <!DOCTYPE ...

  8. 学习笔记-echarts自定义背景图片

    困扰我已久的问题就解决了. code: //使用canvas把背景添加到echarts里 var img = new Image();var canvas = document.createEleme ...

  9. 学习笔记-echarts点击数据添加跳转链接

    原链接:http://echarts.baidu.com/demo.html#pie-rich-text 这个一段官方提供的实例. var weatherIcons = { 'Sunny': './d ...

随机推荐

  1. maven生成项目慢解决办法

    maven生成项目慢,原因:在线更新archetype-catalog.xml文件,从Apache中央仓库. 解决办法,手动下载,放到maven环境. 备用下载地址: https://files.cn ...

  2. 【spring源码分析】IOC容器初始化(十)

    前言:前文[spring源码分析]IOC容器初始化(九)中分析了AbstractAutowireCapableBeanFactory#createBeanInstance方法中通过工厂方法创建bean ...

  3. MySQL 常用语句总结

    用一个表更新另一个表 UPDATE table1 t1, table2 t2 SET t1.field1 = t2.field1, t1.field2 = t2.field2 WHERE t1.fie ...

  4. slice 与 splice 的区别

    slice: 定义一个数组:let b = ['a','b','c','d','e'] b:["a", "b", "c", "d& ...

  5. Elastic Stack-Elasticsearch使用介绍(五)

    一.前言     前4篇将Elasticsearch用法的API和原理方面东西介绍了一下,相信大家对Elasticsearch有了一定的认知,接下我们主要从索引的建立到后期的一些优化做一些介绍: 二. ...

  6. 菜鸟学IT之第一次作业

    作业的要求来自于:https://www.cnblogs.com/greyzeng/p/9581624.html 反思· 为何要来上课并且认真参与? 在大学中的师生关系? 自我简述题目 心得· 学习态 ...

  7. ArrayBlockingQueue源码分析

    ArrayBlockingQueue是一个基于数组实现的有界的阻塞队列. 属性 //底层存储元素的数组.为final说明一旦初始化,容量不可变,所以是有界的. final Object[] items ...

  8. linux ps aux 各列内容说明

    [root@zabbix3 ~]# ps auxUSER       PID %CPU %MEM    VSZ   RSS TTY      STAT START   TIME COMMANDroot ...

  9. python监控机器(第1版)

    # coding:utf-8 import configparser import logging import os import psutil import ctypes import platf ...

  10. axios拦截http拦截

    一,判断登录页面 const routes = [ { path: '/', name: '/', component: Index }, { path: '/repository', name: ' ...