Question

我一直在使用

chart.renderer.path(['M', 12, 0, 'L', 6, 12, 'L', 18, 12, 'Z']).attr({
    'stroke-width' : 2,
    'fill' : 'black',
    'transform' : "translate(" + x + "," + y + ")"        
  }).add();

在图表上绘制三角形路径，并使用“翻译”属性移动到“需要”位置。

但在IE8中，转换属性被忽略（三角形出现在左上角），但它在FF，Chrome等中工作正常。这是CSS3支持问题吗？

是否有解决此问题的工作？

由于彼得

Answer 1

Legacy IE不直接支持transform属性。相反，使用如下的translate方法：

chart.renderer.path(['M', 12, 0, 'L', 6, 12, 'L', 18, 12, 'Z']).attr({
    'stroke-width' : 2,
    'fill' : 'black'
  })
  .translate(x, y)
  .add();

您还可以使用特定的translateX和translateY属性，除了.attr（）外，还可以使用.animate（）。

编辑：这是一个现场演示：http://jsbin.com/iwocow/1/edit

IE8中的Highchart渲染器路径问题

1 个答案: