functiongetChartsLine() {var myChart = echarts.init(document.getElementById('progress'),'macarons');var option ={

title: {

text:'工程折线图', //主标题

textStyle:{

color:'#0DB9F2', //颜色

fontStyle:'normal', //风格

fontWeight:'normal', //粗细

fontFamily:'Microsoft yahei', //字体

fontSize:14, //大小

align:'center' //水平对齐

},

subtext:'副标题', //副标题

subtextStyle:{ //对应样式

color:'#F27CDE',

fontSize:14},

itemGap:7},

grid:{//显示数据的图表位于当前canvas的坐标轴

x:50,

y:55,

x2:50,

y2:60,

borderWidth:1},

tooltip: {

trigger:'axis'},

legend: {

data:["计划完成","实际完成"]

},

toolbox: {

show:true,

feature: {

saveAsImage: {}

}

},

xAxis: {

type:'category',

boundaryGap:false,

data: ["2015-1", "2015-2", "2015-3", "2015-4", "2015-5", "2015-6", "2015-7", "2015-8", "2015-9", "2015-10", "2015-11", "2015-12"]

},

yAxis: {

type:'value',//默认以千分位显示,不想用的可以在这加一段

axisLabel : { //调整左侧Y轴刻度, 直接按对应数据显示

show:true,

showMinLabel:true,

showMaxLabel:true,

formatter:function(value) {returnvalue;

}

}

},

series: [

{

name:"计划",

type:'line',

data: [2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 300, 2.3],

markPoint: {

data: [

{type:'max', name: '最大值'},

{type:'min', name: '最小值'}

]

},

markLine: {

data: [

{type:'average', name: '平均值'},

[{

symbol:'none',

x:'90%',

yAxis:'max'}, {

symbol:'circle',

label: {

normal: {

position:'start',

formatter:'最大值'}

},

type:'max',

name:'最高点'}]

]

}

},

{

name:"实际",

type:'line',

data:[0, 0, 37, 0, 0, 15, 3036, 5572, 0, 0, 0, 0],

markPoint: {

data: [

{type:'max', name: '最大值'},

{type:'min', name: '最小值'}

]

},

markLine: {

data: [

{type:'average', name: '平均值'},

[{

symbol:'none',

x:'90%',

yAxis:'max'}, {

symbol:'circle',

label: {

normal: {

position:'start',

formatter:'最大值'}

},

type:'max',

name:'最高点'}]

]

}

}

]

};

myChart.setOption(option);

}

getChartsLine();

echarts设置标题样式_EChart 标题 title 样式,x轴、y轴坐标显示,调整图表位置等...相关推荐

  1. 修改echarts的x轴y轴的刻度和刻度线文本颜色和xy轴的轴线颜色和标题title的字体颜色

    1,x轴y轴都是一样的: 1.1修改刻度文本颜色: 找到xAxis和yAxis: 添加如下代码:(和data和type同级并列) axisLabel: {show: true,textStyle: { ...

  2. echarts的xAxis和yAxis——x轴y轴以及网格线的详细配置

    先详细看一下xAxis和yAxis配置的图表效果 下图详细的标注了图表中x轴y轴可见的内容 说明一下: x轴y轴在echarts配置项里,从内容上来说大体上没有太大区别,x轴能用的配置项y轴基本也可以 ...

  3. echarts图表折线图柱状图多个X轴Y轴以及一个Y轴反向

    echarts图表折线图柱状图多个X轴Y轴以及一个Y轴反向 option1: {color: ['#21E9F6', '#F2CE2E', '#EE2929', '#006DD9', '#1789FF ...

  4. Echarts去除x轴,y轴网格线,网格区域(背景)

    每次写到Echarts时,总会忘记去除x轴,y轴网格线,网格区域(背景)是怎么设置的了,在这里记录一下,有个印象 xAxis : [{type : 'value',splitNumber: 2,sca ...

  5. matplotlib 笔记:设置x轴 y轴文字

    原本的图: import numpy as np import matplotlib.pyplot as plt lst=range(10000) a=np.random.choice(lst,150 ...

  6. 三菱FX5U,机床X轴Y轴工作台定位控制程序 全部使用两轴直线插补 有自动定位,手动定位!手动控制有,点动一次按钮每次走设置的距离

    三菱FX5U,机床X轴Y轴工作台定位控制程序!使用三菱J4-A系列伺服驱动器绝对位置系统,程序大小27000多步 1.本程序最多可做20个定位工序,全部使用两轴直线插补! 2.有自动定位,手动定位!手 ...

  7. EChart 标题 title 样式,x轴、y轴坐标显示,调整图表位置等

    示例里工作一般情况是够用了,更复杂的可以查询教程: title 官方解说:http://echarts.baidu.com/option.html#title 坐标相关: X轴:http://echa ...

  8. echarts系列-带图教你调整左右位置x轴样式网格虚线刻度居中双轴Y轴滚动上下移动文字旋转改分割线颜色部分字体改色折注混合,X轴的颜色,X轴字体颜色,调整柱子颜色,调整小图标图例的大小和位置,鼠标

    本文已参与「新人创作礼」活动,一起开启掘金创作之路. 宝子们,今天又是开心的一天呢~ 上面先说注意事项 1.如果使用show hidden控制图表显示隐藏,某些切换效果很奇怪,比如饼图,会从左上角开始 ...

  9. Echarts图表设置x轴y轴均随滚轮滚动缩+放 区域缩放

    文章目录 echarts中设置x轴和y轴均随滚轮进行缩放 当数据实时渲染时,也可进行区域缩放 echarts中设置x轴和y轴均随滚轮进行缩放 dataZoom 组件 用于区域缩放,从而能自由关注细节的 ...

  10. echarts柱形图x轴y轴互换_Echarts Y轴底纹改为虚线与设置柱状图为圆角

    1.Echarts Y轴底纹改为虚线: yAxis: { splitLine :{ //网格线 lineStyle:{ type:'dashed' //设置网格线类型 dotted:虚线 solid: ...

最新文章

  1. Pytorch中的5个非常有用的张量操作
  2. 第1章 信息检索基础
  3. Fluid 0.5 版本发布:开启数据集缓存在线弹性扩缩容之路
  4. What is the expectation maximization algorithm?
  5. EOJ Monthly 2019.11 E. 数学题(反演 + 杜教筛 + 拉格朗日插值)
  6. Android 系统(54)---Android系统开篇
  7. DateTimeFormat注解
  8. JavaScript文档DOM对象处理HTML→document属性方法、write、getElementBy**、getsetAttribute、节点操作方法、innerHTML、操作CSS样式属性
  9. h5 img js 点击图片放大_jquery – HTML5 Canvas调整图像点击放大
  10. cookielib和urllib2模块相结合模拟网站登录
  11. 央行降息 北上广深和厦门南京房价反弹可能性最大
  12. Want to be happy? Be grateful - David Steindl-Rast
  13. Ubuntu18.04 鼠标键盘失灵
  14. 玩吧斗兽棋的一些攻略 同级子谁胜负问题
  15. 通讯录2.0(动态内存增长版本)
  16. mysql emoji表情 保存utf8mb4 错误原因总结
  17. nds运行java_NDS看漫画软件 Comic Book DS 1.0 正式版!
  18. Java Part1 Day11继承 方法重写 super多态
  19. 基带传输中的信道编码和信源编码
  20. 吉林大学计算机科学杨凤杰,吉林大学计算机科学与技术学院 [2005-04] 总第36期...

热门文章

  1. python语言程序设计袁方答案_北邮“爱课堂”教学平台
  2. Linux epoll 实现封装
  3. 云计算机教室 国家标准,计算机云网络教室建设方案
  4. 解决IDEA报Unmapped Spring configuration files found.Please configure Spring facet
  5. 天空的颜色 363
  6. 语音芯片ic分类以及sop8的otp语音芯片对比 选型
  7. 中国居民人均财富36.6万元,你达标了吗?
  8. 嵌入式软件工程师待遇怎么样
  9. 如何查看某公司主体下挂了哪些公众号?
  10. java 日语文档翻译_日语文档怎么翻译?我来教会你日语翻译