没有合适的资源？快使用搜索试试~ 我知道了~

文库首页开发技术其它Echarts笔记总结

Echarts笔记总结

Echarts

需积分: 30 3 下载量 129 浏览量 2017-11-12 13:11:25 上传评论收藏 415KB DOC 举报

温馨提示

试读

24页

关于Echarts的总结，重要是以柱状图为例子，附带截图和源码，基本一看就懂了！！

资源推荐

资源详情

资源评论

Title 设置

title:{

show: true,

text: '测试',

link: '<a href="javascript:void(0)"

onclick="test()"></a> ',

target: 'self',

textStyle: {

padding: 5,

color:'red',//也可以设置字体，字号等

fontStyle: 'normal',

fontWeight: normal,

fontFamily: 'sans-serif',

fontSize: 18,

z: 2,

backgroundColor: 'transparent',//默认透明

subtext: '这是副标题',

itemGap: 10,//控制主副标题之间的距离

sublink: '',

subtarget: 'blank',

padding: 5,

//left: 'center',//控制标题位置

top: 'auto',

right: 'auto',

bottom: 'auto',

backgroundColor: 'transparent',//'rgb(128,

60, 128)',//默认透明

Legend:

legend:{

type:'scroll',//scroll,可以滚动翻页的图例，一般在

图例较多时使用，默认 plain

itemGap: 10,//图例之间的距离

data:['更新后各等别基本农田占基本农田总面积比例'],

x:'center',//设置 X 就是在以 x 轴为参照，y 则以 y

为参照

orient: 'horizontal',//vertical,图例列表布局

方向

align:'auto',//对齐方式

selectedMode: true,//点击图例，显示状态

inactiveColor: '#ccc',//'green'//图例关闭时

的颜色

selected: {

// 选中'系列 1'

'系列 1': true,

// 不选中'系列 2'

'系列 2': false

//left: 'auto',

// top: 'auto',

//right: 'auto',

// bottom: 'auto',

width: 'auto',

height: 'auto',

textStyle: {

color: 'blue',

fontStyle: 'normal',

fontWeight: 'normal',

fontFamily: 'sans-serif',

fontSize: 12,

backgroundColor: 'transparent',

borderColor: 'transparent',

borderWidth: 0,

borderRadius: 0,

padding: 0,

backgroundColor: 'pink',//背景色

data: [{

name: '更新后各等别基本农田占基本农田总面积比

例',

//图例项的 icon ECharts 提供的标记类型包括

'circle', 'rect', 'roundRect', 'triangle', 'diamond',

'pin', 'arrow'

//也可以通过 'image://url' 设置为图片，

其中 url 为图片的链接，或者 dataURI。

//可以通过 'path://' 将图标设置为任意的矢

量路径。这种方式相比于使用图片的方式，

//不用担心因为缩放而产生锯齿或模糊，而且可以设

置为任意颜色。路径图形会自适应调整为合适的大小。

//路径的格式参见 SVG PathData。可以从 Adobe

Illustrator 等工具编辑导出。

// 强制设置图形为圆。

// icon: 'diamond',

// 设置文本为红色

textStyle: {

color: 'red',

}],

//图例的 tooltip 配置，配置项同 tooltip。默认不显示，可以在 legend 文字很多的

时候对文字做裁剪并且开启 tooltip，如下示例：

formatter: function (name) {

return echarts.format.truncateText(name, 40, '14px Microsoft Yahei',

'…');

tooltip: {

show: true

关于 X 轴的设置 xAxis

反向坐标轴：

//X 轴设置

xAxis:{

show: true,

gridIndex: 0,//x 轴所在的坐标系,默认第一个坐标系

position:'bottom',//X 轴位置 bottom,top

offset: 0,//默认位置的偏移距离，在有多个 x 轴时

type: 'value',//'category',value//

name: '所占比例',

inverse: false,//坐标轴是否反向

//boundaryGap: ['20%', '20%'],

//坐标轴名称设置

triggerEvent: false,//坐标轴是否触发事件，默认不触发，

nameLocation: 'center',//start,center 坐标名称

nameTextStyle: {

color: 'blue',

fontStyle: 'normal',

fontWeight: 'normal',

fontFamily: 'sans-serif',

fontSize: 12,

align:'center',

剩余23页未读，继续阅读

评论收藏

内容反馈

资源评论

资源反馈

评论星级较低，若资源使用遇到问题可联系上传者，3个工作日内问题未解决可申请退款~

键盘哥

粉丝: 18
资源: 10

上传资源快速赚钱

我的内容管理展开

我的资源快来上传第一个资源

我的收益

登录查看自己的收益

我的积分登录查看自己的积分

我的C币登录后查看C币余额

我的收藏

我的下载

下载帮助

前往需求广场，查看用户热搜

Echarts笔记总结

Echarts样例+个人笔记

echarts3 使用总结（绘制各种图表,地图）

TuChart 基于Tushare和Echarts的股票数据视觉化应用-python

echarts使用小结

SAP 柱形图实现1

8.Echarts总结.rar

Echarts基础教程学习笔记

Echarts学习笔记保姆级教程学完加薪

Jquery Echarts图表插件，自己研究总结实例+注释说明（源码）

echarts笔记。。。

echarts知识总结

ECharts使用心得(echart map)

数据可视化echarts总结

echarts练习笔记-图表模板

echarts公开课，可视化面板案例以及笔记.zip

echars-md笔记(关于echarts在vue的的一些引用和使用以及一些api)

jQuery+html5基于echarts.js中国地图点击弹出下级城市地图代码.zip

echarts学习笔记之图表自适应问题详解

echarts环状图表数据统计插件.zip

struts2图表笔记

数据可视化笔记.zip

三更博客博客项目-Java项目 .zip

高级java笔试题-Documents:分享有关学习或其他方面的文件

阿里云ossjava源码-mengnanClass:一个超级酷的分布式项目,B2C.前端模板化搭建开发速度UPUPUP!后端拿脚写,适合喜欢摸

catchAdmin后台管理系统 v3.1.8.zip

Qt 5实现串口调试助手 （源工程文件、0积分下载）

【SystemVerilog】路科验证V2学习笔记（全600页）.pdf

AutoSAR标准协议4.2.2

光伏-储能并网系统仿真.rar

最新资源

Qt 5实现串口调试助手（源工程文件、0积分下载）