Highchart + Extjs +图表更新

时间:2014-11-11 22:06:01

标签: extjs highcharts

我设置这个jsfiddle来向你展示有关Extjs和Highchart的问题:

http://jsfiddle.net/xea0w8n3/21/

var store = new Ext.data.ArrayStore({
    fields: ['month', 'value'],
    data : [
        ['jan', 1],
        ['feb', 2],
        ['mar', 3],
        ['apr', 4],
        ['mai', 5],
        ['jun', 6],
        ['jul', 16],
        ['aug', 2],
        ['sep', 7],
        ['oct', 4],
        ['nov', 3],
        ['dec', 11]
    ]
});


var chart = Ext.create('Chart.ux.Highcharts', {
    id:'chart',
    series:[{
        dataIndex: 'value'
    }],
    xField: 'month',
    store: store,
    chartConfig: {
        chart: {
            type: 'spline'
        },
        title: {
            text: 'A simple graph'
        },
        xAxis: {
            plotLines: [{
                color: '#FF0000',
                width: 5,
                value: 'mar'
            }]
        }
    }
});

store.load();


Ext.create('Ext.window.Window', {
    title: 'Highchart Testing',
    id:'window',
    closable : true,
    width: 300, 
    height: 400,
    layout:'fit',
    anchor:'100%',
    items:[chart],
    tbar:[
        {
            xtype:'button',
            text:'Add PlotLine',
            handler: function(){


              Ext.getCmp('chart').chart.yAxis[0].addPlotLine({
                      value:'12',
                      width: '2',
                      dashStyle: 'longdashdot',
                    color: 'red'
            });

            }
        }
    ]
}).show();

如果我添加绘图线并调整窗口大小,则该行消失:(

在窗口打开时保留情节线的任何想法?

提前致谢!

此致

1 个答案:

答案 0 :(得分:1)

当我移动窗户时,我遇到了类似的问题。那也发生在你身上吗?我通过在窗口的move事件中隐藏和显示图表来解决这个问题。这有点傻,但它对我有用。

listeners: {
    // For me it was the move event
    resize: function (window) {
        var chart = Ext.getCmp('chart');
        chart.hide();
        chart.show();
    }
}