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 ...
随机推荐
- Node.js在指定的图片模板上生成二维码图片并附带底部文字说明
在Node.js中,我们可以通过qr-image包直接在后台生成二维码图片,使用方法很简单: var qr = require('qr-image'); exports.createQRImage = ...
- react dnd demo2
import React, { Component } from 'react'; import './App.css'; import Card from './Card'; import HTML ...
- python基础杂记
一.编码 1.ACSII 0000 0001 8位 一个字节 2. uncoide ...
- 02Spring Boot配置文件详解
02Spring Boot配置文件详解 文章指导 学习笔记 学习代码 自定义属性 在src/main/java/resources目录下创建一个application.properties或appli ...
- 安装Cnario提示.Net 3.5安装错误, 检查Windows系统更新提示无法检查到更新, 安装.Net 3.5提示"Windows无法完成请求的更改, 错误代码:0x800F081F"
症状: Windows检查系统更新时提示无法完成, 尝试安装.Net 3.5等组件时都无法完成, 错误代码: 0x800F081F 原因: 可能时设置了禁止Windows自动更新, 需要重新打开 解决 ...
- Docker 核心技术之镜像
镜像简介 镜像是一个Docker的可执行文件,其中包括运行应用程序所需的所有代码内容.依赖库.环境变量和配置文件等. 通过镜像可以创建一个或多个容器. 镜像搜索 - docker search 作用: ...
- WebSocket群聊与单聊
一 . WebSocket实现群聊 py文件代码 # py文件 from flask import Flask, render_template, request from geventwebsock ...
- <generatePublisherEvidence> 元素
<configuration> <runtime> <generatePublisherEvidence enabled="false"/> & ...
- scrollbar样式设置
转载:https://segmentfault.com/a/1190000012800450?utm_source=tag-newest author:specialCoder 一 前言 在CSS 中 ...
- hdu-4635(tarjan缩点)
题意:先给你一个n个点,m条边的有向图,问你最多能够增加多少条边,使得这个图不是一个强连通图 解题思路:考虑最多要添加的边数,所以如果能把初始图划分成两个部分,每个部分都是完全图,这两个部分分别用单向 ...