RadHtmlChart make legend visible client side

2 posts, 0 answers
  1. jasear
    jasear avatar
    29 posts
    Member since:
    Jan 2007

    Posted 28 Jun 2013 Link to this post

    Hi,

    I am following this article:

    http://www.telerik.com/community/code-library/aspnet-ajax/html-chart/exporting-radhtmlchart-to-png-and-pdf.aspx

    To export my radhtmlchart to PDF. The problem is that I am hiding the RadHtmlChart Legend and displaying my own custom legend. When I export the chart I see the chart in PDF but no legend (understandbly because I am hiding the legend).

    I believe that a possible solution could be that I make the Legend visible, then generate the SVG text, then hide the legend. Is this possible? Can you suggest a work around?
  2.
  3. Stamo Gochev
    Admin
    Stamo Gochev avatar
    186 posts

    Posted 03 Jul 2013 Link to this post

    Hello,

    You are quite right that the proper way to export the legend is to make it visible just before the start of the export and then hide it again. You can do that using this code snippet (this is a modified version of the getSvgContent() method from the Code Library):

    <script type="text/javascript">
        function getSvgContent(sender)
        {
            //get the chart
            var chart = $find("RadHtmlChart1");
            //show the legend so that it is visible when the export begins
            chart._chartObject.options.legend.visible = true;
            //repaint the chart to apply the changes to the legend
            chart.repaint();
             
            //obtain an SVG version of the chart regardless of the browser
            var chartRendering = $find("<%=RadHtmlChart1.ClientID %>").getSVGString();
            //store the SVG string in a hidden field and escape it so that the value can be posted to the server
            $get("<%=svgHolder.ClientID %>").value = escape(chartRendering);
            //initiate the postback from the button so that its server-side handler is executed
            __doPostBack(sender.name, "");
     
            //hide the legend again
            chart._chartObject.options.legend.visible = false;
            chart.repaint();
        }
    </script>

    The reason why you cannot export your custom legend is probably  because it is created  by HTML while the Code Library relies on the rendered SVG elements of the chart. What you could do in this situation is to search and find a library which provides exporting the HTML content of a page to PNG or PDF and apply it in your scenario.

    Regards,
    Stamo Gochev
    Telerik
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
Back to Top