[CLOSED] Problem with the save chart as image

[Gisystems]

Capture the chart :

var saveChart = function (btn) {
             Ext.MessageBox.confirm('Confirmar Descarga', 'Quieres descargar el gr?fico como una imagen?', function (choice) {
                 if (choice == 'yes') {

                     var svg = Ext.htmlEncode(Ext.draw.engine.SvgExporter.generate(btn.up('panel').down('chart').surface));
             
                     App.direct.ExportSvg(svg, { isUpload: true });
                    
                 }
             });
         }

save the chart as image:

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<%@ Import Namespace="System.Drawing" %>
<%@ Import Namespace="System.IO" %>
<%@ Import Namespace="System.Xml" %>


<script runat="server">
   
    <DirectMethod> _
    Public Sub ExportSvg(ByVal control As String)
        
        If String.IsNullOrEmpty(control) Then
            Ext.Net.X.Msg.Alert("SVG Vacio", "la imagen esta vacio o en blanco")
            Return
        End If                
        
        Dim comilla As String = """"
        Dim valor As String = Replace(control, "<?xml version=" & comilla & "1.0" & comilla, "<?xml version=" & comilla & "1.0" & comilla & " encoding=" & comilla & "UTF-8" & comilla)
        
        Dim decoder As String = Server.HtmlDecode(valor)
        Dim xd As New XmlDocument()
        xd.XmlResolver = Nothing
        xd.LoadXml(decoder)
        
        ' En esta linea se genera el error
        Dim svgGraph = Svg.SvgDocument.Open(xd)
 

        
        Response.Clear()
        Response.ClearContent()
        Response.ClearHeaders()
        Response.AddHeader("Content-Disposition", "attachment; filename=chart.png")
        Response.ContentType = "image/png"

        Using image As Bitmap = svgGraph.Draw()
            Using ms As New MemoryStream()
                image.Save(ms, System.Drawing.Imaging.ImageFormat.Png)
                ms.WriteTo(Response.OutputStream)
            End Using
        End Using
       
        Response.End()
        
    End Sub
    
</script>

xml generated:

<?xml version="1.0" encoding="UTF-8" standalone="yes"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg width="898px" height="446px" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"><defs><linearGradient x1="0" y1="0" x2="1" y2="1" id="theme-fbbc29-eda704-1396419264237"><stop offset="0%" stop-color="#fbbc29" stop-opacity="1"></stop><stop offset="100%" stop-color="#eda704" stop-opacity="1"></stop></linearGradient><linearGradient x1="0" y1="0" x2="1" y2="1" id="theme-ce2e4e-a4253e-1396419264237"><stop offset="0%" stop-color="#ce2e4e" stop-opacity="1"></stop><stop offset="100%" stop-color="#a4253e" stop-opacity="1"></stop></linearGradient><linearGradient x1="0" y1="0" x2="1" y2="1" id="theme-7e0062-4b003a-1396419264237"><stop offset="0%" stop-color="#7e0062" stop-opacity="1"></stop><stop offset="100%" stop-color="#4b003a" stop-opacity="1"></stop></linearGradient><linearGradient x1="0" y1="0" x2="1" y2="1" id="theme-158b90-0f6063-1396419264237"><stop offset="0%" stop-color="#158b90" stop-opacity="1"></stop><stop offset="100%" stop-color="#0f6063" stop-opacity="1"></stop></linearGradient><linearGradient x1="0" y1="0" x2="1" y2="1" id="theme-57880e-395a09-1396419264237"><stop offset="0%" stop-color="#57880e" stop-opacity="1"></stop><stop offset="100%" stop-color="#395a09" stop-opacity="1"></stop></linearGradient><linearGradient x1="0" y1="0" x2="1" y2="1" id="backgroundGradient"><stop offset="0%" stop-color="#ffffff" stop-opacity="1"></stop><stop offset="100%" stop-color="#eaf1f8" stop-opacity="1"></stop></linearGradient></defs><rect width="100%" height="100%" fill="#fff" fill-opacity="0" stroke="none" /><rect x="0" y="0" width="898" height="446" fill="url(#backgroundGradient)" transform="matrix(1,0,0,1,0,0)" /><path d="M 124 382.5 l 764 0 M 124.5 382 l 0 7 M 251.5 382 l 0 7 M 378.5 382 l 0 7 M 506.5 382 l 0 7 M 633.5 382 l 0 7 M 760.5 382 l 0 7 M 888.5 382 l 0 7" fill="none" stroke="#444" stroke-width="1" z-index="0" transform="matrix(1,0,0,1,0,0)" /><text x="120" y="400.5" font-size="12" font-family="Arial, Helvetica, sans-serif" fill="#444" transform="matrix(1,0,0,1,0,0)" ><tspan x="120" dy="3">0</tspan></text><text x="244" y="400.5" font-size="12" font-family="Arial, Helvetica, sans-serif" fill="#444" transform="matrix(1,0,0,1,0,0)" ><tspan x="244" dy="3">10</tspan></text><text x="371" y="400.5" font-size="12" font-family="Arial, Helvetica, sans-serif" fill="#444" transform="matrix(1,0,0,1,0,0)" ><tspan x="371" dy="3">20</tspan></text><text x="499" y="400.5" font-size="12" font-family="Arial, Helvetica, sans-serif" fill="#444" transform="matrix(1,0,0,1,0,0)" ><tspan x="499" dy="3">30</tspan></text><text x="626" y="400.5" font-size="12" font-family="Arial, Helvetica, sans-serif" fill="#444" transform="matrix(1,0,0,1,0,0)" ><tspan x="626" dy="3">40</tspan></text><text x="753" y="400.5" font-size="12" font-family="Arial, Helvetica, sans-serif" fill="#444" transform="matrix(1,0,0,1,0,0)" ><tspan x="753" dy="3">50</tspan></text><text x="881" y="400.5" font-size="12" font-family="Arial, Helvetica, sans-serif" fill="#444" transform="matrix(1,0,0,1,0,0)" ><tspan x="881" dy="3">60</tspan></text><text x="0" y="0" font-size="18" font-family="Arial" fill="#444" transform="matrix(1,0,0,1,467.5,429.8)" ><tspan x="" dy="4.5">Cantidad</tspan></text><path d="M 251.5 381.5 l 0 -370 M 378.5 381.5 l 0 -370 M 506.5 381.5 l 0 -370 M 633.5 381.5 l 0 -370 M 760.5 381.5 l 0 -370" fill="none" stroke="#ccc" stroke-width="1" z-index="0" transform="matrix(1,0,0,1,0,0)" /><path d="M 124.5 382 l 0 -372 M 124 357.5 l -6 0 M 124 316.5 l -6 0 M 124 276.5 l -6 0 M 124 236.5 l -6 0 M 124 196.5 l -6 0 M 124 155.5 l -6 0 M 124 115.5 l -6 0 M 124 75.5 l -6 0 M 124 35.5 l -6 0" fill="none" stroke="#444" stroke-width="1" z-index="0" transform="matrix(1,0,0,1,0,0)" /><text x="72" y="357" font-size="12" font-family="Arial, Helvetica, sans-serif" fill="#444" transform="matrix(1,0,0,1,0,0)" ><tspan x="72" dy="3">BRASIL</tspan></text><text x="67" y="316" font-size="12" font-family="Arial, Helvetica, sans-serif" fill="#444" transform="matrix(1,0,0,1,0,0)" ><tspan x="67" dy="3">PANAM?</tspan></text><text x="8" y="276" font-size="12" font-family="Arial, Helvetica, sans-serif" fill="#444" transform="matrix(1,0,0,1,0,0)" ><tspan x="8" dy="3">ESTADOS UNIDOS</tspan></text><text x="45" y="236" font-size="12" font-family="Arial, Helvetica, sans-serif" fill="#444" transform="matrix(1,0,0,1,0,0)" ><tspan x="45" dy="3">NICARAGUA</tspan></text><text x="43" y="196" font-size="12" font-family="Arial, Helvetica, sans-serif" fill="#444" transform="matrix(1,0,0,1,0,0)" ><tspan x="43" dy="3">COSTA RICA</tspan></text><text x="33" y="155" font-size="12" font-family="Arial, Helvetica, sans-serif" fill="#444" transform="matrix(1,0,0,1,0,0)" ><tspan x="33" dy="3">EL SALVADOR</tspan></text><text x="45" y="115" font-size="12" font-family="Arial, Helvetica, sans-serif" fill="#444" transform="matrix(1,0,0,1,0,0)" ><tspan x="45" dy="3">HONDURAS</tspan></text><text x="69" y="75" font-size="12" font-family="Arial, Helvetica, sans-serif" fill="#444" transform="matrix(1,0,0,1,0,0)" ><tspan x="69" dy="3">M?XICO</tspan></text><text x="71" y="35" font-size="12" font-family="Arial, Helvetica, sans-serif" fill="#444" transform="matrix(1,0,0,1,0,0)" ><tspan x="71" dy="3">BELICE</tspan></text><path d="M 124.5 357.5 l 762 0 M 124.5 316.5 l 762 0 M 124.5 276.5 l 762 0 M 124.5 236.5 l 762 0 M 124.5 196.5 l 762 0 M 124.5 155.5 l 762 0 M 124.5 115.5 l 762 0 M 124.5 75.5 l 762 0 M 124.5 35.5 l 762 0" fill="none" stroke="#ccc" stroke-width="1" z-index="0" transform="matrix(1,0,0,1,0,0)" /><rect x="125" y="343" width="4" height="29" fill="none" stroke="rgb(200,200,200)" stroke-opacity="0.05" stroke-width="6px" transform="matrix(1,0,0,1,1.2,1.2)" /><rect x="125" y="343" width="4" height="29" fill="none" stroke="rgb(150,150,150)" stroke-opacity="0.1" stroke-width="4px" transform="matrix(1,0,0,1,0.9,0.9)" /><rect x="125" y="343" width="4" height="29" fill="none" stroke="rgb(100,100,100)" stroke-opacity="0.15" stroke-width="2px" transform="matrix(1,0,0,1,0.6,0.6)" /><rect x="125" y="343" width="4" height="29" fill="url(#theme-fbbc29-eda704-1396419264237)" stroke="rgb(251,188,41)" stroke-width="0px" transform="matrix(1,0,0,1,0,0)" /><rect x="125" y="303" width="4" height="29" fill="none" stroke="rgb(200,200,200)" stroke-opacity="0.05" stroke-width="6px" transform="matrix(1,0,0,1,1.2,1.2)" /><rect x="125" y="303" width="4" height="29" fill="none" stroke="rgb(150,150,150)" stroke-opacity="0.1" stroke-width="4px" transform="matrix(1,0,0,1,0.9,0.9)" /><rect x="125" y="303" width="4" height="29" fill="none" stroke="rgb(100,100,100)" stroke-opacity="0.15" stroke-width="2px" transform="matrix(1,0,0,1,0.6,0.6)" /><rect x="125" y="303" width="4" height="29" fill="url(#theme-fbbc29-eda704-1396419264237)" stroke="rgb(251,188,41)" stroke-width="0px" transform="matrix(1,0,0,1,0,0)" /><rect x="125" y="263" width="8" height="29" fill="none" stroke="rgb(200,200,200)" stroke-opacity="0.05" stroke-width="6px" transform="matrix(1,0,0,1,1.2,1.2)" /><rect x="125" y="263" width="8" height="29" fill="none" stroke="rgb(150,150,150)" stroke-opacity="0.1" stroke-width="4px" transform="matrix(1,0,0,1,0.9,0.9)" /><rect x="125" y="263" width="8" height="29" fill="none" stroke="rgb(100,100,100)" stroke-opacity="0.15" stroke-width="2px" transform="matrix(1,0,0,1,0.6,0.6)" /><rect x="125" y="263" width="8" height="29" fill="url(#theme-fbbc29-eda704-1396419264237)" stroke="rgb(251,188,41)" stroke-width="0px" transform="matrix(1,0,0,1,0,0)" /><rect x="125" y="222" width="18" height="29" fill="none" stroke="rgb(200,200,200)" stroke-opacity="0.05" stroke-width="6px" transform="matrix(1,0,0,1,1.2,1.2)" /><rect x="125" y="222" width="18" height="29" fill="none" stroke="rgb(150,150,150)" stroke-opacity="0.1" stroke-width="4px" transform="matrix(1,0,0,1,0.9,0.9)" /><rect x="125" y="222" width="18" height="29" fill="none" stroke="rgb(100,100,100)" stroke-opacity="0.15" stroke-width="2px" transform="matrix(1,0,0,1,0.6,0.6)" /><rect x="125" y="222" width="18" height="29" fill="url(#theme-fbbc29-eda704-1396419264237)" stroke="rgb(251,188,41)" stroke-width="0px" transform="matrix(1,0,0,1,0,0)" /><rect x="125" y="182" width="21" height="29" fill="none" stroke="rgb(200,200,200)" stroke-opacity="0.05" stroke-width="6px" transform="matrix(1,0,0,1,1.2,1.2)" /><rect x="125" y="182" width="21" height="29" fill="none" stroke="rgb(150,150,150)" stroke-opacity="0.1" stroke-width="4px" transform="matrix(1,0,0,1,0.9,0.9)" /><rect x="125" y="182" width="21" height="29" fill="none" stroke="rgb(100,100,100)" stroke-opacity="0.15" stroke-width="2px" transform="matrix(1,0,0,1,0.6,0.6)" /><rect x="125" y="182" width="21" height="29" fill="url(#theme-fbbc29-eda704-1396419264237)" stroke="rgb(251,188,41)" stroke-width="0px" transform="matrix(1,0,0,1,0,0)" /><rect x="125" y="142" width="21" height="29" fill="none" stroke="rgb(200,200,200)" stroke-opacity="0.05" stroke-width="6px" transform="matrix(1,0,0,1,1.2,1.2)" /><rect x="125" y="142" width="21" height="29" fill="none" stroke="rgb(150,150,150)" stroke-opacity="0.1" stroke-width="4px" transform="matrix(1,0,0,1,0.9,0.9)" /><rect x="125" y="142" width="21" height="29" fill="none" stroke="rgb(100,100,100)" stroke-opacity="0.15" stroke-width="2px" transform="matrix(1,0,0,1,0.6,0.6)" /><rect x="125" y="142" width="21" height="29" fill="url(#theme-fbbc29-eda704-1396419264237)" stroke="rgb(251,188,41)" stroke-width="0px" transform="matrix(1,0,0,1,0,0)" /><rect x="125" y="101" width="55" height="29" fill="none" stroke="rgb(200,200,200)" stroke-opacity="0.05" stroke-width="6px" transform="matrix(1,0,0,1,1.2,1.2)" /><rect x="125" y="101" width="55" height="29" fill="none" stroke="rgb(150,150,150)" stroke-opacity="0.1" stroke-width="4px" transform="matrix(1,0,0,1,0.9,0.9)" /><rect x="125" y="101" width="55" height="29" fill="none" stroke="rgb(100,100,100)" stroke-opacity="0.15" stroke-width="2px" transform="matrix(1,0,0,1,0.6,0.6)" /><rect x="125" y="101" width="55" height="29" fill="url(#theme-fbbc29-eda704-1396419264237)" stroke="rgb(251,188,41)" stroke-width="0px" transform="matrix(1,0,0,1,0,0)" /><rect x="125" y="61" width="122" height="29" fill="none" stroke="rgb(200,200,200)" stroke-opacity="0.05" stroke-width="6px" transform="matrix(1,0,0,1,1.2,1.2)" /><rect x="125" y="61" width="122" height="29" fill="none" stroke="rgb(150,150,150)" stroke-opacity="0.1" stroke-width="4px" transform="matrix(1,0,0,1,0.9,0.9)" /><rect x="125" y="61" width="122" height="29" fill="none" stroke="rgb(100,100,100)" stroke-opacity="0.15" stroke-width="2px" transform="matrix(1,0,0,1,0.6,0.6)" /><rect x="125" y="61" width="122" height="29" fill="url(#theme-fbbc29-eda704-1396419264237)" stroke="rgb(251,188,41)" stroke-width="0px" transform="matrix(1,0,0,1,0,0)" /><rect x="125" y="21" width="752" height="29" fill="none" stroke="rgb(200,200,200)" stroke-opacity="0.05" stroke-width="6px" transform="matrix(1,0,0,1,1.2,1.2)" /><rect x="125" y="21" width="752" height="29" fill="none" stroke="rgb(150,150,150)" stroke-opacity="0.1" stroke-width="4px" transform="matrix(1,0,0,1,0.9,0.9)" /><rect x="125" y="21" width="752" height="29" fill="none" stroke="rgb(100,100,100)" stroke-opacity="0.15" stroke-width="2px" transform="matrix(1,0,0,1,0.6,0.6)" /><rect x="125" y="21" width="752" height="29" fill="url(#theme-fbbc29-eda704-1396419264237)" stroke="rgb(251,188,41)" stroke-width="0px" transform="matrix(1,0,0,1,0,0)" /><text x="133" y="357.5985401459854" font-size="14" font-family="Arial" fill="#333" transform="matrix(1,0,0,1,0,0)" ><tspan x="133" dy="3.5">0.26-%</tspan></text><text font-size="14" font-family="Arial" fill="#000" fill-opacity="0" transform="matrix(1,0,0,1,0,0)" ><tspan x="" dy="3.5">58.99-%</tspan></text><text x="133" y="317.5985401459854" font-size="14" font-family="Arial" fill="#333" transform="matrix(1,0,0,1,0,0)" ><tspan x="133" dy="3.5">0.26-%</tspan></text><text x="137" y="277.5985401459854" font-size="14" font-family="Arial" fill="#333" transform="matrix(1,0,0,1,0,0)" ><tspan x="137" dy="3.5">0.53-%</tspan></text><text x="147" y="236.5985401459854" font-size="14" font-family="Arial" fill="#333" transform="matrix(1,0,0,1,0,0)" ><tspan x="147" dy="3.5">1.32-%</tspan></text><text x="150" y="196.5985401459854" font-size="14" font-family="Arial" fill="#333" transform="matrix(1,0,0,1,0,0)" ><tspan x="150" dy="3.5">1.59-%</tspan></text><text x="150" y="156.5985401459854" font-size="14" font-family="Arial" fill="#333" transform="matrix(1,0,0,1,0,0)" ><tspan x="150" dy="3.5">1.59-%</tspan></text><text x="184" y="115.5985401459854" font-size="14" font-family="Arial" fill="#333" transform="matrix(1,0,0,1,0,0)" ><tspan x="184" dy="3.5">4.23-%</tspan></text><text x="251" y="75.5985401459854" font-size="14" font-family="Arial" fill="#333" transform="matrix(1,0,0,1,0,0)" ><tspan x="251" dy="3.5">9.52-%</tspan></text><text x="820" y="35.598540145985396" font-size="14" font-family="Arial" fill="#333" transform="matrix(1,0,0,1,0,0)" ><tspan x="820" dy="3.5">58.99-%</tspan></text></svg>

problem:

[Daniil]

Hi @Gisystems,

I cannot reproduce the problem.

Could you, please, provide a standalone test case to reproduce?

Is that reproducible without this line?

Dim valor As String = Replace(control, "<?xml version=" & comilla & "1.0" & comilla, "<?xml version=" & comilla & "1.0" & comilla & " encoding=" & comilla & "UTF-8" & comilla)