Highchart + Extjs + chart Updates

家住魔仙堡 提交于 2019-12-13 08:22:47

问题


I setup this jsfiddle to show you an issue regarding Extjs and 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();

If I add a Plot Line and resize the window the line disappear :(

Any ideas to keep the plotline while window is open?

Thanks in advance!

Regards


回答1:


I've had a similar issue with the line disappearing when I move the window. Does that also happen for you? I worked around the problem by hiding and showing the chart on the window's move event. It is a bit silly but it worked for me.

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


来源:https://stackoverflow.com/questions/26875490/highchart-extjs-chart-updates

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!