由于公司产品的需要，最近几个月都在使用eCharts，功能还是很强大的，基本能够实现你想要的任何效果。但是在使用的过程中，碰到一个eCharts本身不支持的功能，就是eCharts只画有真实数据的点，没有真实数据的用”-“表示的点是不画的，所以就会出现一种情况：如果2个非连续的点之间存在空值，那么图看起来就是断开了。但是很多时候，我们希望能够直接把他们用直线连接起来，而eCharts又没有直接提供这种功能，怎么办呢？在网上找了很多，也没有发现相关的解决方案。没办法，只能靠自己了。最开始想直接看eCharts的源码，找到对应的地方，自己来提供这种功能，但是费时费力所以作罢，项目进度不允许。后来灵光一现，找到一个很简单的方法，也很好实现。不敢独享，希望分享出来，让后面碰到类似问题的朋友，能够起到一个很好的借鉴。
废话不多说，直接说具体的思路：既然eCharts只画有数据的点，那么我们就干脆让让中间这些空数据点也有值，最后连起来的线刚好让其看起来是一条直线，问题就解决了。那么怎么实现呢？其实也很简单，x轴的TickLength都是等长度的，又已经知道了左右两边的有效点的x值和y值，现在问题就转换为：对于中间这些没有实际数据的x值，对某个x值，如何给其设置一个y值，让中间这些点最后连起来的时候是一条直线！相信聪明的你，根据简单的几何学就应该知道怎么做了吧！相似三角形的等份原理很容易求得对应的y值。这里奉上一张原理图，让大家更清晰:
最低0.47元/天 解锁文章
1819
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
