echarts仪表盘option_echarts仪表盘配置参数

require.config({

paths:{

echarts:"js/chart"}

});

require(['echarts','echarts/chart/gauge'],function(ec){var option ={

tooltip : {

formatter:"{a}
{b} : {c}分"},

toolbox: {//工具栏 如刷新、保存为图片等

show : false,/*feature : {

mark : {show: true},

restore : {show: true},

saveAsImage : {show: true}

}*/},

series : [

{

name:'',//仪表盘名字

type:'gauge',//类型是仪表盘

radius: 70,

data:[{value:85, name: '得分'}],//仪表盘的值为85,鼠标经过时显示的框名字为“得分”

center : ['50%', '78'],//仪表盘的位置 第一个值为x轴,第二个值为y轴

startAngle:180,//开始角度

endAngle:0,//结束角度

splitNumber: "none",//刻度的值,如果设置为0,在IE8中,左上角有多一块内容,不需要显示就设置为none,需要显示就设置具体数值,如10

axisLine: { //坐标轴线,也就是圆圈的边框线

show: false, //默认显示,属性show控制显示与否

lineStyle: { //属性lineStyle控制线条样式

//color: [[0.2, 'f9fafb'],[0.4, 'orange'],[0.8, 'skyblue'],[1, '#ff4500']],

width: 10}

},

pointer: {//point为设置指针箭头的效果

//这个show属性好像有问题,因为在这次开发中,需要去掉指正,我设置false的时候,还是显示指针,估计是BUG吧,我用的echarts-3.2.3;希望改进。最终,我把width属性设置为0,成功搞定!

//当鼠标经过时会显示 箭头中间会显示一条白色的区域,这个区域可以通过css调整 如#map canvas[data-zr-dom-id=_zrender_hover_]{display: none!important;}

show: true,//指针长度

length:'60%',

width:4,

color:"#000"},

textStyle: {//其余属性默认使用全局文本样式,详见TEXTSTYLE

//color: '#333'

},

splitLine: {//分隔线

show: false, //默认显示,属性show控制显示与否

length :20, //属性length控制线长

lineStyle: { //属性lineStyle(详见lineStyle)控制线条样式

//color: '#eee',

width: 2,

type:'solid'}

},

title : {

show :false,//offsetCenter: ['-65%', -10], // x, y,单位px

textStyle: { //其余属性默认使用全局文本样式,详见TEXTSTYLE

color: '#333',

fontSize :15}

},

detail : {//最下边数值的设置

show : true,//backgroundColor: 'rgba(0,0,0,0)',

//borderWidth: 0,

//borderColor: '#ccc',

//width: 100,

//height: 40,

offsetCenter: ['0', '10'], //x, y,单位px

formatter:'{value}%',

textStyle: {//其余属性默认使用全局文本样式,详见TEXTSTYLE

color: '#3ebf27',

fontSize :18}

},

axisTick: {//坐标轴小标记

show: false, //属性show控制显示与否,默认不显示

splitNumber: 5, //每份split细分多少段

length :8, //属性length控制线长

lineStyle: { //属性lineStyle控制线条样式

color: '#eee',

width:1,

type:'solid'}

}

}

]

};var authWay = ec.init(document.getElementById("map"));

authWay.setOption(option);

window.οnresize=authWay.resize;

});

表情包
插入表情
评论将由博主筛选后显示,对所有人可见 | 还能输入1000个字符
相关推荐
©️2020 CSDN 皮肤主题: 1024 设计师:白松林 返回首页