Hybrid View

  1. #1
    Sencha User
    Join Date
    Jul 2011
    Posts
    3
    Vote Rating
    0
    cxBrad is on a distinguished road

      0  

    Default Dynamically add series to a chart?

    Dynamically add series to a chart?


    I am trying to add a new series to an existing chart (the existing chart works fine). This was pretty simple in Ext JS 3, but I can't figure it out in 4. Here is what I've got:

    Code:
    var chart = theGraph.getComponent('intakeChart');
    
    var newSeries = Ext.create('Ext.chart.LineSeries', {
    	type: 'line',
    	id: 'series1',
    	axis: 'left',
    	yField: 'jobcount'
    	});
    
    chart.series.add(newSeries);
    
    chart.surface.removeAll();
    chart.redraw(false);
    When I call this code, I get the following error:

    "Uncaught TypeError: Cannot read property 'surface' of undefined"

    Any ideas on what I'm doing wrong?

  2. #2
    Sencha User
    Join Date
    Aug 2010
    Posts
    7
    Vote Rating
    0
    jmitchell.br is on a distinguished road

      0  

    Default


    I too am wondering how this is done. I'd like to avoid re-creating my chart from scratch each time I need to toggle a line. Is this even possible in extjs 4?

  3. #3
    Sencha User
    Join Date
    Jul 2011
    Posts
    12
    Vote Rating
    1
    blincv is on a distinguished road

      0  

    Default


    I have the same problem... anyone got a solution yet?

  4. #4
    Sencha User
    Join Date
    Jul 2009
    Posts
    14
    Vote Rating
    0
    tinabucur is on a distinguished road

      0  

    Default


    I need the same thing. I would want to define a serie with is own store . Any ideas?

  5. #5
    Sencha User
    Join Date
    Apr 2010
    Posts
    48
    Vote Rating
    0
    whippersnapper is on a distinguished road

      0  

    Default


    *knock knock*... Anybody found the solution to this yet? I'm stuck with the same problem.

  6. #6
    Sencha User
    Join Date
    May 2010
    Posts
    4
    Vote Rating
    -1
    electronix is an unknown quantity at this point

      0  

    Default partially solved

    partially solved


    Hello all,

    I use the following method to add dynamically series to a chart:
    Code:
    // define the new serie (do not use Ext.create())
    var serie = 
            {
                  type: 'line'
                 ,axis: 'left'
                 ,smooth: true
                 ,xField: 'name'
                 ,yField: 'data3' 
            };
    
    // add the serie to the chart (the variable 'chart' holds the complete chart component)
    chart.add(serie);
    
    // redraw the chart
    chart.redraw();
    This solution works for me, but the next problem is: how to remove a serie dynamically from the chart? I can 'remove()' them from the chart but the .redraw() function does not update the surface...
    I bet the solution will be found by today and I keep you updated...

  7. #7
    Sencha User
    Join Date
    Mar 2011
    Posts
    2
    Vote Rating
    0
    ayeah is on a distinguished road

      0  

    Default


    try this step by step:
    chart.surface.removeAll();
    chart.series.removeAll();
    chart.series.addAll(NewSeries);
    chart.redraw();
    chart.refresh();
    Last edited by ayeah; 9 Feb 2014 at 12:56 AM. Reason: style