小小园丁

echarts拐点样式修改

echarts的拐点可以是'circle''rect''roundRect''triangle''diamond''pin''arrow''none'

还可以是'image://url'

如果是svg. 那么可以这么展示:

复制代码
 1 option = {
 2   xAxis: {
 3     type: 'category',
 4     data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
 5   },
 6   yAxis: {
 7     type: 'value'
 8   },
 9   series: [
10     {
11       data: [120, 200, 150, 80, 70, 110, 130],
12       type: 'line',
13       symbol: 'path://M170.688 128h682.624c23.616 0 42.688 19.072 42.688 42.688v682.624a42.688 42.688 0 0 1-42.688 42.688H170.688A42.688 42.688 0 0 1 128 853.312V170.688C128 147.072 147.072 128 170.688 128z m42.624 85.312v597.376h597.376V213.312H213.312z',
14       symbolSize: 20,
15       lineStyle: {
16         color: '#5470C6',
17         width: 1,
18         type: 'solid'
19       },
20       itemStyle: {
21         borderWidth: 3,
22         borderColor: '#EE6666',
23         color: 'yellow'
24       }
25     }
26   ]
27 };
复制代码

 

posted on   小小园丁  阅读(161)  评论(0编辑  收藏  举报

相关博文:
阅读排行:
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· Manus的开源复刻OpenManus初探
· AI 智能体引爆开源社区「GitHub 热点速览」
· 三行代码完成国际化适配,妙~啊~
· .NET Core 中如何实现缓存的预热?

导航

统计信息

点击右上角即可分享
微信分享提示