Design time configuration wizard not data aware

[Chris]

Hi.

I'm used to working with DevExpress controls. When I use the Configuration Wizard I simple drag and drop the columns from my data source (SQL) and everything just lights up. 

In the Telerik RadHTMLChart Configuration Wizard, even though I've connected to a SQLDataSource and data is coming through fine, I still have to type the column names in the wizard.

And I still haven't figured out how to do this for stacked column chart.

Am I missing something? Is there another tool I should be using for this? I should be able to create a sqldatasource based stacked column chart in about 10 seconds!

Thanks.

[Vessy]

Hi Chris,

RadChtmlChart provides a complex functionality providing several boundable fields for the different series type, thus it needs the developers to specify the exact values that will be displayed.

Another reason is the fact that the most of our clients use different (more descriptive) names for the the series and their value fields.

Please, note, that not all functionality of the chart is available in its wizard, so it has to be configured through the code. Setting the Stacked="True" property of the first column series will be enough to get a stacked chart:

https://docs.telerik.com/devtools/aspnet-ajax/controls/htmlchart/functionality/stacked-series

For example:

        <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:YourConnectionString %>"
            SelectCommand="SELECT [Year], [Value],[Value2] FROM [Data] WHERE ([Subcategory_Id] = 1)"></asp:SqlDataSource>
        <telerik:RadHtmlChart runat="server" ID="RadHtmlChart1" DataSourceID="SqlDataSource1">
            <PlotArea>
                <Series>
                    <telerik:ColumnSeries DataFieldY="Value" Name="Electricity Consumption" Stacked="true">
                    </telerik:ColumnSeries>
                    <telerik:ColumnSeries DataFieldY="Value2" Name="Water Consumption">
                    </telerik:ColumnSeries>
                </Series>
                <XAxis DataLabelsField="Year">
                    <LabelsAppearance RotationAngle="75" />
                    <TitleAppearance Text="Year" />
                </XAxis>
                <YAxis>
                    <TitleAppearance Text="MWh" />
                </YAxis>
            </PlotArea>
            <Legend>
                <Appearance Visible="false" />
            </Legend>
            <ChartTitle Text="Electricity Consumption">
            </ChartTitle>
        </telerik:RadHtmlChart>

Regards,
Vessy
Progress Telerik

[Chris]

In your example above you specify Value and Value2 for the two dffferent series.
I want to be able to use only the Value column (MWh in my example below) for both series but filter the data in the recordset. In my case, by scope.

So scope 1 MWh will be series 1 and scope 2 MWh will be series 2. How do I do this?

E.g.
Year MWh Scope
2017 50000 1
2017 30000 2
2018 67000 2
2018 43000 1
2019 34000 1
2019 23000 2

[Vessy]

Hello Chris,

RadHtmlChart is only a data visualizing control and, unfortunately, cannot filter, group or manipulate the data on its own. In order to bind the chart with the provided data set, you will either group it manually as per the desired criteria prior binding it to the chart, or implement the approach provided in the following code library:

https://www.telerik.com/support/code-library/group-radhtmlchart-data-source

Regards,
Vessy
Progress Telerik

[Chris]

ok. Thank you.