常见问题:

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. Node.js在指定的图片模板上生成二维码图片并附带底部文字说明

    在Node.js中,我们可以通过qr-image包直接在后台生成二维码图片,使用方法很简单: var qr = require('qr-image'); exports.createQRImage = ...

  2. react dnd demo2

    import React, { Component } from 'react'; import './App.css'; import Card from './Card'; import HTML ...

  3. python基础杂记

    一.编码 1.ACSII                        0000 0001           8位       一个字节 2. uncoide                     ...

  4. 02Spring Boot配置文件详解

    02Spring Boot配置文件详解 文章指导 学习笔记 学习代码 自定义属性 在src/main/java/resources目录下创建一个application.properties或appli ...

  5. 安装Cnario提示.Net 3.5安装错误, 检查Windows系统更新提示无法检查到更新, 安装.Net 3.5提示"Windows无法完成请求的更改, 错误代码:0x800F081F"

    症状: Windows检查系统更新时提示无法完成, 尝试安装.Net 3.5等组件时都无法完成, 错误代码: 0x800F081F 原因: 可能时设置了禁止Windows自动更新, 需要重新打开 解决 ...

  6. Docker 核心技术之镜像

    镜像简介 镜像是一个Docker的可执行文件,其中包括运行应用程序所需的所有代码内容.依赖库.环境变量和配置文件等. 通过镜像可以创建一个或多个容器. 镜像搜索 - docker search 作用: ...

  7. WebSocket群聊与单聊

    一 . WebSocket实现群聊 py文件代码 # py文件 from flask import Flask, render_template, request from geventwebsock ...

  8. <generatePublisherEvidence> 元素

    <configuration> <runtime> <generatePublisherEvidence enabled="false"/> & ...

  9. scrollbar样式设置

    转载:https://segmentfault.com/a/1190000012800450?utm_source=tag-newest author:specialCoder 一 前言 在CSS 中 ...

  10. hdu-4635(tarjan缩点)

    题意:先给你一个n个点,m条边的有向图,问你最多能够增加多少条边,使得这个图不是一个强连通图 解题思路:考虑最多要添加的边数,所以如果能把初始图划分成两个部分,每个部分都是完全图,这两个部分分别用单向 ...