echarts去掉刻度盘更换指针

一般搜到这个问题我猜你应该是想只留仪表盘的指针和数字,然后放个切图的背景刻度,更换切图指针吧。下面上实例:需要注意的是icon处可更换指针,使用图片地址或base64时前面要加上image://哦。...

一般搜到这个问题我猜你应该是想只留仪表盘的指针和数字,然后放个切图的背景刻度,更换切图指针吧。下面上实例:需要注意的是icon处可更换指针,使用图片地址或base64时前面要加上image://哦。

option = {
series: [{
type: 'gauge',
startAngle: 193,
endAngle: -11,
min: 0,
max: 10,
splitNumber: 5,
progress: {
show: false,
},
pointer: {
icon:
'image://data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAByCAYAAAHL4ariAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3FpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDpjMmEwZjU0Ny02MDZhLTA2NDctOWQ4Mi02ODQ3ODkzODNkNzIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MzQ2MUJBQTJGQTRDMTFFQjgwM0RCQUNCRkRDQ0NDN0UiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MzQ2MUJBQTFGQTRDMTFFQjgwM0RCQUNCRkRDQ0NDN0UiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjM2NGI0NGZmLWQwNzYtYmY0YS05YmE2LTYzYmE2ODVhNGM0NyIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpjMmEwZjU0Ny02MDZhLTA2NDctOWQ4Mi02ODQ3ODkzODNkNzIiLz4gPC9y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',
length: 114,
width: 21,
offsetCenter: [5, 10],
},
axisLine: {
show: false,
},
axisTick: {
show: false,
},
splitLine: {
show: false,
},
axisLabel: {
distance: 55,
color: '#fff',
fontSize: 26,
},
title: {
show: false,
},
detail: {
show: false,
},
data: [{
value: 5,
}],
}],
};

效果:

attachments-2021-08-avZUvf5K61192436b173d.png


此时已经去掉了刻度盘等无用信息,只需要在echarts的盒子上加个切图仪表盘背景即可。

你可能感兴趣的文章

相关问题

0 条评论

请先 登录 后评论
admin
admin

651 篇文章

作家榜 »

  1. admin 651 文章
  2. 粪斗 185 文章
  3. 王凯 92 文章
  4. 廖雪 78 文章
  5. 牟雪峰 12 文章
  6. 李沁雪 9 文章
  7. 全易 2 文章
  8. Stevengring 0 文章