Extjs Charting Series with dashed line

Question

我正在使用Extjs 4来创建折线图.现在我想用虚线创建一个图表系列.目前我的代码看起来如下:

series: [{
type: 'line',
axis: 'left',
xField: 'name',
yField: 'data1',
style: {
    fill: '#18428E',
    stroke: '#18428E',
    'stroke-width': 3
},
markerConfig: {
    type: 'circle',
    size: 4,
    radius: 4,
    'stroke-width': 0,
    fill: '#18428E',
    stroke: '#18428E'
}
}, ...    

我尝试将'border-style'设置为'dashed',但这不起作用.这在ExtJs Charting中是否可行？

Answer 1

你错过了一个属性让虚线工作.您还需要添加stroke-dasharray属性.这是更新的代码:

style: {            
    fill: '#18428E',
    stroke: '#18428E',
    'stroke-width': 3,
    'stroke-dasharray': 10  // You need to add this!
},
markerConfig: {
    type: 'circle',
    size: 4,
    radius: 4,
    'stroke-width': 0,
    fill: '#18428E',
    stroke: '#18428E'
},

您将必须使用值(在我的情况下为10)来获得所需的短划线长度.请注意,这不适用于IE(因为它使用VML渲染图形).其他浏览器应该正确呈现它.