效果
还可以添加判断现实部分
使用markpoint 引入base64格式
markPoint: {
data: item.data.map((qitem, qindex) => ({
coord: [qindex, qitem],
symbol: `image://data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAABGdBTUEAALGPC/xhBQAAACBjSFJN
AAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAilBMVEX///8AAAAAAAAAAAAA
AAAAAAAAAADPRUXqTE7xTk/vTk/qTE3LRETiSUvzTk/zT1DiSUvLRETpS03vTU7wTk/vTk/rTU7q
TEzSREfzT1DMQkLgSUvfSUnvTk/vTU7LQ0PyTk/yV1jyWFn5uLn5urr6u7z6vb71e3z1fH32jI32
iYnzZmfzZGX///8Ap66yAAAAIHRSTlMAAQIFCAoDSrjo5rZEhf78ekCt3e7jvrJP/UaCd+XkRTA2
RwMAAAABYktHRACIBR1IAAAAB3RJTUUH5QkPAzobcqT7egAAAIxJREFUGNNtj+kSgjAMhEmacogW
b8SL9T7f//kMLTjj4P7YSb+2ySaK/omIVUTfMxuxVgy3hGJJ0myQDyWmcC8jh8MRxVj8GzKJA05n
oJiYBrCkAC5XtalwA2zWgZkNYN6BRQCy1Pp2Vyv9FzIrbfp4AtXaN9WxG4fXG9U2jPXB8t2+rNtg
/ej95X70ATzGCjM7EQGRAAAAJXRFWHRkYXRlOmNyZWF0ZQAyMDIxLTA5LTE0VDE5OjU4OjI3KzA4
OjAwrEwOHwAAACV0RVh0ZGF0ZTptb2RpZnkAMjAyMS0wOS0xNFQxOTo1ODoyNyswODowMN0RtqMA
AAARdEVYdGV4aWY6Q29sb3JTcGFjZQAxD5sCSQAAABJ0RVh0ZXhpZjpFeGlmT2Zmc2V0ADI2Uxui
ZQAAABd0RVh0ZXhpZjpQaXhlbFhEaW1lbnNpb24AMTa998GMAAAAF3RFWHRleGlmOlBpeGVsWURp
bWVuc2lvbgAxNmBhGAkAAAAgdEVYdHNvZnR3YXJlAGh0dHBzOi8vaW1hZ2VtYWdpY2sub3JnvM8d
nQAAABh0RVh0VGh1bWI6OkRvY3VtZW50OjpQYWdlcwAxp/+7LwAAABd0RVh0VGh1bWI6OkltYWdl
OjpIZWlnaHQAMTYdr15vAAAAFnRFWHRUaHVtYjo6SW1hZ2U6OldpZHRoADE25QCe4gAAABl0RVh0
VGh1bWI6Ok1pbWV0eXBlAGltYWdlL3BuZz+yVk4AAAAXdEVYdFRodW1iOjpNVGltZQAxNjMxNjIw
NzA3HUVAbwAAABF0RVh0VGh1bWI6OlNpemUANjUxQkIH8ZGhAAAARnRFWHRUaHVtYjo6VVJJAGZp
bGU6Ly8vYXBwL3RtcC9pbWFnZWxjL2ltZ3ZpZXcyXzlfMTYyODY1MTc2Mjk2ODEwOTBfMzZfWzBd
xniuAwAAAABJRU5ErkJggg==`,
symbolSize: qitem > item.divider ? 0 : 18,
symbolOffset: [0, '-70%'],
}))
},
引入图片文件
import TipsSvg from '@/assets/img/svg/tips.svg'
symbol: `image://${TipsSvg}`,
分别对应这两种方式