Is there a way to have a calculated series?

[Jonathan Travis]

I have a stock chart where I'm showing values from two years for comparison.  In my json, I have a field that shows the delta between the two values, ((thisyear - lastyear) / lastyear)

The problem I have is when the user zooms out of the chart, the delta gets aggregated incorrectly.

I want to know if I can create a series and add the formula that I showed, and have the chart calculate the delta instead of adding it to the json object.

[T. Tsonev]

Hi,

You can have series that build the data points on the fly. This is achieved by means of custom aggregate:
      series: [{
        aggregate: function(values, series, dataItems, category) {
          ...
        }
      }]

-- Live demo --

This is a viable solution if you can calculate the delta from the dataItems alone.

Regards,
T. Tsonev
Telerik

 

 

[Jonathan Travis]

That's good news.  Is there a way to do this with the MVC wrapper?

[T. Tsonev]

Hello,

That's a good question because this doesn't seem to be possible with the MVC wrappers. We'll add the necessary overloads to allow setting custom aggregates.
I hope the fix will make it into the next internal build.

Thanks for spotting this omission. As a token of gratitude for your involvement your Telerik points have been updated.

Regards,
T. Tsonev
Telerik

 

 

[Jonathan Travis]

Thanks for the update.  I'll be looking forward to the next release.

[Jonathan Travis]

I've decided to convert my chart to an html chart specifically for this functionality, but the dataItems object is empty.

What am I doing wrong?

function createChart() {
    $("#htmlChart").kendoStockChart({
        dateField: "PostingDate",
        theme: "blueopal",
        chartArea: {
            height: 450
        },
        legend: {
            position: "top",
            visible: true
        },
        seriesDefaults: {
            type: "line",
            style: "smooth",
            tooltip:
           {
               visible: true,
               template: "#=TemplateFormat(value, category)#"
           }
        },
        series: [
        {
            field: "ThisYear",
            noteTextField: "ThisYearNote",
            name: "This Year",
            color: "orange",
            notes: {
                position: "top",
                label: {
                    position: "outside",
                    background: "rgba(255,255,255,.8)",
                    border: {
                        color: "orange",
                        width: 2
                    }
                }
            },

        }, {
            field: "LastYear",
            noteTextField: "LastYearNote",
            name: "Last Year",
            color: "#00CC00",
            notes: {
                position: "bottom",
                label: {
                    position: "outside",
                    background: "rgba(255,255,255,.8)",
                    border: {
                        color: "#00CC00",
                        width: 2
                    }
                }
            }

        },
            {
                field: "Planned",
                name: "Planned",
                color: "purple"

            },
            {
                name: "Delta",
                type: "area",
                aggregate: function(values, series, dataItems, category) {
                    return "1";
                }
            }
        ],
        categoryAxis: {
            axisCrossingValue: [0, 1000]
        },
        valueAxis: [
        {
            axisCrossingValue: -9999999999,
            plotBands: [
                { from: -999999999, to: 0, color: "#c00", opacity: 0.2 }
            ]
        }, { visible: false }, { visible: false }],

        navigator: {
            series: {
                type: "area",
                line: {
                    style: "smooth"
                },
                field: "ThisYear"
            },
            select: {
                from: window.startDate,
                to: window.endDate
            }
        },
        tooltip: {
            format: "C0",
            color: "white"

        },
        selectEnd: SelectionChanged,
        dragEnd: SelectionChanged,
        zoomEnd: SelectionChanged

    });
}

[T. Tsonev]

Hi,

The dateItems list will be supplied if the aggregate is defined on a data-bound series. This will normally be all data points that fall within a specific category (date range).
For "unbound" series you only get the category parameter.

The result from the aggregate will determine what will be plotted. This can be a simple value or an object with the same structure as the data item.

Regards,
T. Tsonev
Telerik

 

 

[Jonathan Travis]

Got it, thanks