首页 > 代码库 > Echart 使用图表简单示例
Echart 使用图表简单示例
简单应用方式:
<div id="main"></div> 引用Echart <script src="http://www.mamicode.com/js/echarts.common.min.js"></script> var myChart = echarts.init(document.getElementById(‘main‘)); option={ ...配置项 } myChart.setOption(option);
配置项设置:
//两边留白:
boundaryGap:[‘30%‘, ‘30%‘]
//不要刻度线:
axisTick:{
show:false
},
//设置轴线线宽:
axisLine:{
lineStyle:{
width:2
}
}
//不要网格:
grid:{
show:false,
}
//Y轴轴线不显示
yAxis : [
{
show:false,
}
//数据结果设置
series : [
{
type:‘line‘,
symbol:‘circle‘,//拐点的形状 实心圆
symbolSize:24,//拐点的形状的大小
label:{
normal:{
show:true,
// offset:[0,-10],
textStyle:{
color:"#5181bb",//提示值的字体颜色设置
}
}
},
itemStyle:{
normal:{
color:"#5181bb"
}
},
data:[10, 50, 80, 100, 150, 60],//数据
}
]
]
更多配置参考 :http://echarts.baidu.com/option.html#xAxis.nameGap
Echart 使用图表简单示例
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。