腾讯管家测网速仪表盘echarts控件怎么写?
emphasis: {
// 高亮的 仪表盘指针样式
itemStyle: {
//高亮 和正常 两者具有同样的配置项,只是在不同状态下配置项的值不同。
}
},
title: {
// 仪表盘标题。
show: true, // 是否显示标题,默认 true。
offsetCenter: [0, “50%”], //相对于仪表盘中心的偏移位置,数组第一项是水平方向的偏移,第二项是垂直方向的偏移。可以是绝对的数值,也可以是相对于仪表盘半径的百分比。
color: “#8B8B8B”, // 文字的颜色,默认 #333。
fontSize: 20 // 文字的字体大小,默认 15。
},
detail: {
// 仪表盘详情,用于显示数据。
show: true, // 是否显示详情,默认 true。
offsetCenter: [0, "50%"], // 相对于仪表盘中心的偏移位置,数组第一项是水平方向的偏移,第二项是垂直方向的偏移。可以是绝对的数值,也可以是相对于仪表盘半径的百分比。
color: "#fff", // 文字的颜色,默认 auto。
fontSize: 12, // 文字的字体大小,默认 15。
backgroundColor: "#fff",
width:200,
// formatter: "{value}", // 格式化函数或者字符串
// formatter: function(value) {
// return value
// }
},
// markPoint: {
// symbol: "circle",
// symbolSize: 8,
// data: [
// //跟你的仪表盘的中心位置对应上,颜色可以和画板底色一样
// { x: "center", y: "center", itemStyle: { color: "#FFF" } }
// ]
// },
data: [{ value:"" , name: ""}]
}
]
};
export default {
name: “ZvChartPanel”,
props: {
data: {
type: String
},
title: {
type: String,
default() {
return “加载中”;
}
},
name: {
type: String,
default() {
return “加载中”;
}
},
unit: {
type: String,
default() {
return “”
}
},
min: {
type: Number,
default() {
return 0;
}
},
max: {
type: Number,
default() {
return 2500;
}
}
},
data() {
return {
chart: null,
instanceChartOption: {}
};
},
methods: {
drawGauge() {
let option = gaugeOption;
this.chart = echarts.init(this. r e f s . g a u g e , " w a l d e n " ) ; o p t i o n . s e r i e s [ 0 ] . m i n = t h i s . m i n ; o p t i o n . s e r i e s [ 0 ] . m a x = t h i s . m a x ; o p t i o n . s e r i e s [ 0 ] . d a t a [ 0 ] . v a l u e = ( p a r s e F l o a t ( t h i s . d a t a