How to remove linking for legend in htmlchart

[Neetha]

I have 2 html charts side by side with same x-axis and y-axis , I would like to single legend instead of 2.

<telerik:RadHtmlChart runat="server" ID="RadHtmlChart2" Width="300" Height="200">
                    <Legend>
                        <Appearance Position="Right"  >                           
                            <TextStyle FontSize="12"   Color="Blue" FontFamily="Courier New, sans-serif" />
                        </Appearance>                        
                    </Legend>

Anyway to remove links (clicking on one legend will highlight the first one and hide the second.) Please let me know. I wanted to show the legend but just remove the linking, just need a static text with colors next to it.

[Marin Bratanov]

Hello Neetha,

If your charts have the same axes, you can consider combining all series into a single chart.

Nevertheless, to override the default behavior where a click on the series name in the legend hides the series, you need to cancel the events. Note that this is not officially supported in the control at the moment and there are some issues with the legendItemHover event. Nevertheless, here is a small example:

    <telerik:RadHtmlChart ID="RadHtmlChart1" runat="server" Width="300px" Height="300px">
        <PlotArea>
            <Series>
                <telerik:LineSeries Name="first">
                    <SeriesItems>
                        <telerik:CategorySeriesItem Y="1" />
                        <telerik:CategorySeriesItem Y="1" />
                        <telerik:CategorySeriesItem Y="1" />
                    </SeriesItems>
                </telerik:LineSeries>
                <telerik:LineSeries Name="second">
                    <SeriesItems>
                        <telerik:CategorySeriesItem Y="11" />
                        <telerik:CategorySeriesItem Y="11" />
                        <telerik:CategorySeriesItem Y="11" />
                    </SeriesItems>
                </telerik:LineSeries>
            </Series>
        </PlotArea>
    </telerik:RadHtmlChart>
<script type="text/javascript">
    function stopEvent(evt) {
        $telerik.cancelRawEvent(evt);
    }

    function preventChartLegendClicks() {
        var chart = $find("<%=RadHtmlChart1.ClientID %>")._chartObject;
        chart.bind("legendItemClick", stopEvent);
        //chart.bind("legendItemHover", stopEvent);
        Sys.Application.remove_load(preventChartLegendClicks);
    }
    Sys.Application.add_load(preventChartLegendClicks);
</script>

Regards,

Marin Bratanov
Telerik