Dynamic value axes for multi-axis chart

3 posts, 0 answers
  1. Tonih
    Tonih avatar
    35 posts
    Member since:
    Nov 2012

    Posted 05 Aug 2013 Link to this post

    Hi,

    Based on this example: http://jsbin.com/orabax/8/edit
    How would I define a second valueaxis dynamically, if I dynamically added a second series to the chart through the datasource? And how would the series know which axis to reference.

    I have a situation where I am adding new series to the chart when a user clicks its name in a series list. However, some of the series in the list have different unit values and needs to be displayed in the chart but on another valueaxis (multiaxis). How would I accomplish this dynamically. I can already update the chart dynamically with different series of the same unit value, which correctly places them on the same valueaxis. I do this by adding the new series to my datasource, then I update the chart like so

    function createChart() {    
                $("#chart").kendoStockChart(
                  // Create a deep copy of the configuration
                  // for each Chart instance.
                  $.extend(true, {}, config)
                );
                $("#chart").data("kendoStockChart").dataSource.data(myDataSource);
              }

    Thanks,
    Tonih
  2. Iliana Nikolova
    Admin
    Iliana Nikolova avatar
    2622 posts

    Posted 07 Aug 2013 Link to this post

    Hi Tonih,

    By design Kendo UI Chart does not support dynamic changes of its configuration options. As a possible workaround I can suggest you setting the new axis via chart.options, however you should refresh the chart. For example:

    //get reference to the StockChart widget
    var chart= $("#stock-chart").data("kendoStockChart");
    //add a new valueAxis with some configuration options
    chart.options.valueAxis.push({name:"newValueAxis", min: 20, max: 40 });
    //associate the first series to the newly added valueAxis
    chart.options.series[0].valueAxis = "newValueAxis"
    //refresh the chart
    chart.refresh();
      Regards,
    Iliana Nikolova
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Tonih
    Tonih avatar
    35 posts
    Member since:
    Nov 2012

    Posted 07 Aug 2013 Link to this post

    Thanks Iliana,

    I will give this a try.

    Tonih
Back to Top