Stockchart: Line and Volume in same pane

[Peter]

Hi,

the example http://demos.telerik.com/aspnet-mvc/financial/panes show how to plot the volume in a second pane.

How can I plot Line + Volume in one pane? Similar: http://finance.yahoo.com/chart/aapl

Peter

[Danail Vasilev]

Hi Peter,

You can simply remove the panes - http://dojo.telerik.com/UBaNe

Regards,
Danail Vasilev
Telerik by Progress

[Peter]

Hi Danail,

Thank you, it works in a pane.

But the Volume Bar Chart should only in the lower partt (~30%). I can set the maximum of the axis to a value.

But how can I set it  automatic to 30%  of Max of Volme data?

Also the navigator time frame is set static to

select: {
                        from: "2009/02/05",
                        to: "2011/10/07"
                    }

Can I set it

to: Maximum Date of Data

from: to -- 2 Months

?

 

Regards,

Peter

 

[Peter]

For the volumeAxis I modified a forum solution from Kendo Charts Minimum value for a Max of ValueAxis

<script type="text/javascript">
var initDefaults = kendo.dataviz.NumericAxis.fn.initDefaults;
kendo.dataviz.NumericAxis.fn.initDefaults = function () {
     var defaults = initDefaults.apply(this, arguments);
     if (defaults.name == "volumeAxis ") {
         defaults.max = Math.ceil(defaults.max * 3 / 500) * 500; //30% of max & rund up to 500
         defaults.min=0
         defaults.majorUnit = defaults.max / 5; //5 ticks
     }
      return defaults;
 };
</script>

[Danail Vasilev]

Hi Peter,

You can use the select method of the navigator in order to set the to/from values.

Regards,
Danail Vasilev
Telerik by Progress

[Peter]

Yes I know,

but how can I get the maximum date maxdate of the stock dataset, so I can write to set the navigator to the last month of data

select: {
                       from: maxdate.setMonth(maxdate.getMonth() - 1),
                       to: lastdate
                    }

[Peter]

would be nice  the forum has an edit option. The code:

select: {
    from: maxdate.setMonth(maxdate.getMonth() - 1),
    to:   maxdate
    }

[Danail Vasilev]

Hello Peter,

To select all the data you can try to set a very small and very large values for the from/to properties. If you want, however, to get the min/max dates you can try the following:
     - Sort the data source by the date field:

$("#stock-chart").data("kendoStockChart").dataSource.sort({ field: "Date", dir: "asc" })

     - Get the min/max values for the date:

var min = $("#stock-chart").data("kendoStockChart").dataSource.view()[0].Date;
var max = $("#stock-chart").data("kendoStockChart").dataSource.view()[$("#stock-chart").data("kendoStockChart").dataSource.view().length-1].Date;

Regards,
Danail Vasilev
Telerik by Progress

[Peter]

Hello Danail,

thank you. I  tested also dataSource.view() but the values are not sorted.
And I didn't found in the Kendo API documentaion dataSource the  method sort({ field: "Date", dir: "asc" })

The docu is every poor:
dataSource - Object
DataSource configuration or instance.

Which object? With google I found kendo.data.DataSource . A link would be very useful.

Regards,

Peter

 

[Danail Vasilev]

Hi Peter,

Did you try the provided sample because it works properly on my side For example by executing it over this demo - http://demos.telerik.com/kendo-ui/financial/index

Regarding the sort method I had already provided a link to it in my previous post - http://docs.telerik.com/kendo-ui/api/javascript/data/datasource#methods-sort

Regards,
Danail Vasilev
Telerik by Progress

[Peter]

Yes, I found it. It would be helpfull if there is a link from

http://docs.telerik.com/kendo-ui/api/javascript/dataviz/ui/stock-chart#configuration-dataSource

dataSource Object
DataSource configuration or instance.

to docs.telerik.com/kendo-ui/api/javascript/data/datasource

Peter