Completed
Last Updated: 04 Dec 2014 06:44 by ADMIN
ADMIN
Created by: Danail Vasilev
Comments: 0
Category: HtmlChart
Type: Feature Request
6
For the time being series can be stacked through the chartObject. For example:
JavaScript:
	<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
		<script>
			function pageLoad() {
				var chart = $find("<%=AreaChart.ClientID%>");
				chart._chartObject.options.seriesDefaults.stack = true;
				chart.repaint();
			}
		</script>
	</telerik:RadCodeBlock>
ASPX:
	<telerik:RadHtmlChart runat="server" ID="AreaChart" Width="800" Height="500" Transitions="true">
			<PlotArea>
				<Series>
					<telerik:AreaSeries Name="Sales" MissingValues="Gap">
						<SeriesItems>
							<telerik:CategorySeriesItem Y="400" />
							<telerik:CategorySeriesItem Y="500" />
							<telerik:CategorySeriesItem Y="720" />
							<telerik:CategorySeriesItem Y="1300" />
							<telerik:CategorySeriesItem Y="450" />
							<telerik:CategorySeriesItem Y="800" />
							<telerik:CategorySeriesItem Y="900" />
						</SeriesItems>
					</telerik:AreaSeries>
					<telerik:AreaSeries Name="Expenses" MissingValues="Gap">
						<SeriesItems>
							<telerik:CategorySeriesItem Y="700" />
							<telerik:CategorySeriesItem Y="900" />
							<telerik:CategorySeriesItem Y="420" />
							<telerik:CategorySeriesItem Y="1100" />
							<telerik:CategorySeriesItem Y="650" />
							<telerik:CategorySeriesItem Y="600" />
							<telerik:CategorySeriesItem Y="700" />
						</SeriesItems>
					</telerik:AreaSeries>
				</Series>
			</PlotArea>
		</telerik:RadHtmlChart>
Completed
Last Updated: 26 Feb 2015 17:26 by ADMIN
Currently when LineSeries Item's YValue is smaller than the BarSeries/ColumnSeries Item's value and both Series Items share the same category, the BarSeries/ColumnSeries Item is the one that receives the mouseover event, so only the bar/column item tooltip is shown. It is not possible to hover over the marker for the  LineSeries and trigger client-side event handlers or show its tooltip. The LineSeries can be hovered/clicked only outside of the area of the Bar/Column Item.
Completed
Last Updated: 30 Sep 2018 19:30 by Karen
For the time being the following workaround can be used:

JavaScript:

    <script>
        function pageLoad() {
            var chart = $find("<%=RadHtmlChart1.ClientID%>");
            chart._chartObject.options.series[0].missingValues = "Gap";
            chart.repaint();
        }
    </script>
ASPX:

        <telerik:RadHtmlChart ID="RadHtmlChart1" runat="server">
            <PlotArea>
                <Series>
                    <telerik:LineSeries MissingValues="Gap">
                        <SeriesItems>
                            <telerik:CategorySeriesItem Y="30" />
                            <telerik:CategorySeriesItem Y="10" />
                            <telerik:CategorySeriesItem />
                            <telerik:CategorySeriesItem Y="30" />
                        </SeriesItems>
                    </telerik:LineSeries>
                </Series>
            </PlotArea>
        </telerik:RadHtmlChart>
Completed
Last Updated: 31 Jan 2018 15:18 by Dane
For example by exposing an additional width property.
Completed
Last Updated: 07 Jun 2013 05:34 by Jon
Currently there are only three properties exposed by the MarkersAppearance - MarkersType, BackgroundColor and Visible in AreaSeries, LineSeries, ScatterSeries and ScatterLineSeries. Expose more properties like Size, BorderColor and BorderWidth for the markers in the mentioned Series. For the time being the following workaround can be used:

        function pageLoad() {
            var circle = document.getElementsByTagName("circle");
            for (var i = 0; i < circle.length; i++) {
                //Modify the size of the marker
                circle[i].r.baseVal.value = 15;
            }
            //Modify the width of the marker border
            $telerik.$('circle').attr('stroke-width', 13);
        }
Completed
Last Updated: 12 Mar 2014 16:26 by ADMIN
ADMIN
Created by: Danail Vasilev
Comments: 0
Category: HtmlChart
Type: Feature Request
1
Similar to the SplineArea in RadChart: 
http://www.telerik.com/help/aspnet-ajax/chart-types-spline-area.html
Unplanned
Last Updated: 15 Jun 2021 12:36 by ADMIN
Currently labels for SeriesItems having Y of 0 are not displayed in PieSeries and DonutSeries due to visual considerations. Improve the handling of such labels.
Completed
Last Updated: 06 Jun 2014 11:44 by ADMIN
Created by: David Sanderson
Comments: 1
Category: HtmlChart
Type: Feature Request
0
Your html charts are coming along beautifully - Just want more! Particularly a Spline chart - ideally to add as option for combination charts.  This could also work as a Pareto chart.
Won't Fix
Last Updated: 19 Jan 2016 16:48 by ADMIN
Currently labels of SeriesItems with values greater or equal  to the YAxis MaxValue are being cut:

    When chart title is not set.
    AND the labels position is set to Above for AreaSeries, LineSeries, ScatterSeries and ScatterLineSeries.
    OR the labels position is set to outsideEnd for ColumnSeries.
    In FireFox, Opera and WebKit browsers.

For the time being the chart title can be set with space character.
Completed
Last Updated: 30 Jun 2016 15:38 by ADMIN
Currently LineSeries, ScatterSeries and ScatterLineSeries expose MarkersType property that gets only three values - Circle, Square and Triangle. Add the ability to set  custom images as markers as well. 
Completed
Last Updated: 27 Apr 2015 12:04 by ADMIN
ADMIN
Created by: Danail Vasilev
Comments: 3
Category: HtmlChart
Type: Bug Report
3
Currently a long legend in RadHtmlChart overflows the PlotArea under IE, while in the rest browsers it is cut. The workaround is to hide the legend and create a custom one in a styled div (e.g. KendoUI demonstrates such an example here - http://demos.kendoui.com/dataviz/bubble-charts/index.html)
Completed
Last Updated: 04 Dec 2014 06:44 by Aurelien
ADMIN
Created by: Danail Vasilev
Comments: 1
Category: HtmlChart
Type: Feature Request
1
For the time being the series can be stacked through the chartObject. For example:
	<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
		<script>
			function pageLoad() {
				var chart = $find("<%=LineChart.ClientID%>");
				chart._chartObject.options.seriesDefaults.stack = true;
				chart.repaint();
			}
		</script>
	</telerik:RadCodeBlock>
<telerik:RadHtmlChart runat="server" ID="LineChart" Width="800" Height="500" Transitions="true">
			<PlotArea>
				<Series>
					<telerik:LineSeries Name="Sales" MissingValues="Gap">
						<SeriesItems>
							<telerik:CategorySeriesItem Y="400" />
							<telerik:CategorySeriesItem Y="500" />
							<telerik:CategorySeriesItem Y="720" />
							<telerik:CategorySeriesItem Y="1300" />
							<telerik:CategorySeriesItem Y="450" />
							<telerik:CategorySeriesItem Y="800" />
							<telerik:CategorySeriesItem Y="900" />
						</SeriesItems>
					</telerik:LineSeries>
					<telerik:LineSeries Name="Expenses" MissingValues="Gap">
						<SeriesItems>
							<telerik:CategorySeriesItem Y="700" />
							<telerik:CategorySeriesItem Y="900" />
							<telerik:CategorySeriesItem Y="420" />
							<telerik:CategorySeriesItem Y="1100" />
							<telerik:CategorySeriesItem Y="650" />
							<telerik:CategorySeriesItem Y="600" />
							<telerik:CategorySeriesItem Y="700" />
						</SeriesItems>
					</telerik:LineSeries>
				</Series>
			</PlotArea>
		</telerik:RadHtmlChart>
Completed
Last Updated: 27 Feb 2014 16:19 by matt
ADMIN
Created by: Danail Vasilev
Comments: 5
Category: HtmlChart
Type: Feature Request
12
Expose a Visible property for the Series in RadHtmlChart. For example when a Series is clicked it can be hidden.
For the time being the following workaround can be used:
JavaScript:
	<script>
		function pageLoad() {
			var chart = $find("<%=RadHtmlChart1.ClientID%>");
			chart._chartObject.options.series[0].visible = false;
			chart.repaint();
		}
	</script>
ASPX:
		<telerik:RadHtmlChart ID="RadHtmlChart1" runat="server" Width="600" Height="400">
			<PlotArea>
				<Series>
					<telerik:ColumnSeries Name="Series 1">
						<SeriesItems>
							<telerik:CategorySeriesItem Y="30" />
							<telerik:CategorySeriesItem Y="10" />
							<telerik:CategorySeriesItem Y="20" />
						</SeriesItems>
					</telerik:ColumnSeries>
					<telerik:ColumnSeries Name="Series 2">
						<SeriesItems>
							<telerik:CategorySeriesItem Y="5" />
							<telerik:CategorySeriesItem Y="12" />
							<telerik:CategorySeriesItem Y="8" />
						</SeriesItems>
					</telerik:ColumnSeries>
				</Series>
			</PlotArea>
		</telerik:RadHtmlChart>
Completed
Last Updated: 13 Feb 2014 12:21 by Peter
Created by: Andreas
Comments: 1
Category: HtmlChart
Type: Feature Request
6
When making business web applications, it is really useful with Funnel charts.
This type is used a lot when making sales funnels!
Won't Fix
Last Updated: 10 Jun 2015 09:21 by ADMIN
Currently the datasource columns which have space in their name cannot be passed to a databound RadHtmlChart. Add the ability to handle the spaces in the names of these columns.
Completed
Last Updated: 13 Sep 2018 12:40 by ADMIN
ADMIN
Created by: Danail Vasilev
Comments: 12
Category: HtmlChart
Type: Feature Request
15
LineBreak is not supported by SVG (more on that - http://www.w3.org/TR/SVG11/text.html#Introduction) and RadHtmlChart uses SVG to render in modern browsers. Add the ability to handle long label text in SVG as well. Currently long strings are getting clipped. 

For the time being the labels can be manually split in separate text elements. For example:
		<script>
			function pageLoad() {
				wrapLabels();
			}
			function wrapLabels() {
				//Find all text elements on the page
				var textElements = document.getElementsByTagName("text");
				//Iterate through the text elements
				for (var i = 0; i < textElements.length; i++) {
					var currTextEl = textElements[i];
					//Set the desired string/symbol that represents the line break
					var lineBreakSymbol = "@LineBreak@";
					if (currTextEl.textContent.indexOf(lineBreakSymbol) != -1) {
						var lines = currTextEl.textContent.split(lineBreakSymbol);
						//Adjust the x and y coordinates for the new text element from the old one
						var textAlignCoefficient = 7;
						var x = currTextEl.attributes.x.textContent * 1 + lines[1].length * textAlignCoefficient;
						var y = currTextEl.attributes.y.textContent * 1 + 20;
						//Obtain the same style for the new text element from the old one
						var style = currTextEl.attributes.style.textContent;
						//Add the new SVG text element
						addSVGTextElement(currTextEl, x, y, style, lines[1]);
						//Adjust the text and the position for the old text element
						currTextEl.textContent = lines[0];
						currTextEl.attributes.x.textContent = currTextEl.attributes.x.textContent * 1 + lines[1].length * textAlignCoefficient;
					}
				}
			}
			function addSVGTextElement(placeHolder, x, y, style, text) {
				var newText = document.createElementNS("http://www.w3.org/2000/svg", "text");

				newText.setAttributeNS(null, "x", x);
				newText.setAttributeNS(null, "y", y);
				newText.setAttributeNS(null, "style", style);

				var textNode = document.createTextNode(text);
				newText.appendChild(textNode);
				placeHolder.parentNode.insertBefore(newText, placeHolder);
			}
		</script>
		<telerik:RadHtmlChart ID="RadHtmlChart1" runat="server" Width="600px" Height="400px">
			<ChartTitle Text="Chart title @LineBreak@ more text in title">
			</ChartTitle>
			<PlotArea>
				<Series>
					<telerik:ColumnSeries Name="Series 1">
						<SeriesItems>
							<telerik:CategorySeriesItem Y="30" />
							<telerik:CategorySeriesItem Y="10" />
							<telerik:CategorySeriesItem Y="20" />
						</SeriesItems>
						<LabelsAppearance>
							<ClientTemplate>
Category is #=category#@LineBreak@Value is: #=value#
							</ClientTemplate>
						</LabelsAppearance>
					</telerik:ColumnSeries>
				</Series>
				<XAxis>
					<Items>
						<telerik:AxisItem LabelText="item 1" />
						<telerik:AxisItem LabelText="item 2" />
						<telerik:AxisItem LabelText="item 3" />
					</Items>
				</XAxis>
			</PlotArea>
		</telerik:RadHtmlChart>
Completed
Last Updated: 04 Jul 2014 12:27 by ADMIN
Created by: Paul
Comments: 2
Category: HtmlChart
Type: Bug Report
1
When a pie chart is rendered with large labels they may be clipped because the pie chart is not sized correctly.  When the legend is enabled the pie chart sizes correctly to handle long labels.
Completed
Last Updated: 07 Jun 2013 12:02 by ADMIN
Hovering or clicking on the series name in the legend will highlight or toggle the visibility of the series. 
Completed
Last Updated: 17 Feb 2014 17:49 by ADMIN
Currently PieChart exposes the labels of its items outside the Pie, while the DonutChart exposes the labels inside the Donut.
 Add the ability to choose the location of the item's label (e.g. center, insideEnd, outsideEnd) in PieSeries and DonutSeries. This can be done either by exposing additional property or by expanding the values range of the current position property.
Completed
Last Updated: 07 Jun 2013 04:58 by Rob
Created by: Rob
Comments: 0
Category: HtmlChart
Type: Feature Request
33
I would like to be able to supply DateTime values for the x axis of an HTMLChart scatter line series to represent a timeline.  Would it be possible to make this easier by having the control plot points plotted based upon the tick count of the value and add support for appropriate label format strings?