在IE9中使用内联SVG实现带间隙的绘图

时间:2014-01-27 06:42:50

标签: graph svg internet-explorer-9

我正在尝试使用SVG折线实现动态线图。我需要以某种方式显示无效/不可用数据的图中的间隙。当XHR超时或者获取的值不是数字时会发生这种情况。

我尝试的解决方法是在图中插入极值(3.4e + 8)代替间隙,然后对可绘制的值范围设置限制。

当我控制绘图中显示的最小值和最大值时,极值自然会超出绘图,所有有效值都显示在绘图中。因此实现了差距。

问题是firefox和chrome没有显示“极端值”,但IE9确实如此。所以我的绘图线超出了预期的图形区域。

我知道IE9可能以完全不同的方式呈现SVG。但有没有解决方法?

2 个答案:

答案 0 :(得分:1)

您是否仍然坚持使用<polyline>?如果不是,那么使用<path>会更简单。无论何时需要跳过,只需使用移动。

<path d="M 0,10 L 1,9 2,13 3,7 M 5,11 L 6,21"/>

此处跳过x = 3和x = 5之间的段。

答案 1 :(得分:0)

此问题已解决here

基本上,我需要将style属性“overflow”设置为“hidden”:

style="overflow: hidden;"