Question

我使用ExtJS系列渲染器函数来设置散点图的fill属性，而不是使用markerConfig属性。因为我想为每个点填充不同的颜色。工作正常。

renderer : function(sprite, record, attr, index, store) {
   Ext.apply(attr, {
       fill : '#F00'
   }
}

但是我想设置type属性，这样每个点都会显示不同的类型，如circle，cross，plus，diamond等。它不起作用。和散点的半径，我无法在渲染器函数中设置属性。

如何在渲染器功能中执行此操作？

Answer 1

为此，您可以使用这些类型（根据文档）：

circle - 绘制圆圈。您可以使用半径设置半径精灵配置中的参数。
rect - 渲染矩形。您可以设置的宽度和高度通过使用精灵中的width和height参数来构造矩形配置。
text - 将文本渲染为精灵。您可以设置字体/字体大小使用font参数。
path - 最强大的精灵类型。有了它你就可以创造使用SVG路径语法的任意形状。你可以快速找到关于如何开始使用路径语法的教程。

所以，例如，如果你需要加号，你可以这样做：

renderer : function(sprite, record, attr, index, store) {
    var plus="M-1.1538461538461537,-1.1538461538461537l0,-2.3076923076923075,2.3076923076923075,0,0,2.3076923076923075,2.3076923076923075,0,0,2.3076923076923075,-2.3076923076923075,0,0,2.3076923076923075,-2.3076923076923075,0,0,-2.3076923076923075,-2.3076923076923075,0,0,-2.3076923076923075,z";
    return Ext.apply(attr, { fill: '#F00', type: 'path', path: plus });
}

文档链接：http://www.sencha.com/learn/drawing-and-charting/

ExtJS图表系列的渲染器功能

1 个答案: