locked
SVG DOM Bug crashes Metro App

    Question

  • I have created a SVG document in Windows 8 Metro Application, however when I try to delete the SVG nodes in the DOM it crashes with the following message:

    The program '[1516] WWAHost.exe' has exited with code -1073741819 (0xc0000005).

    There seems to be bug in the removeChild() SVG DOM method or am I doing something wrong?

    I have also uploaded the project on skydrive:

    https://skydrive.live.com/?cid=3dc6681f40c57df4&sc=documents&id=3DC6681F40C57DF4%21576

     

    Zia Khan,

    Microsoft MVP

     

    Saturday, November 5, 2011 12:52 PM

Answers

  • This is a bug in Internet Explorer 10 that reproduces outside of metro.  It has something to do with this element: <marker id="Endpoint"

    I filed a bug with the IE team.  Thanks for Reporting this!

    -Jeff

     

     


    Jeff Sanders (MSFT)
    Monday, November 7, 2011 3:20 PM
    Moderator

All replies

  • I have created a SVG document in Windows 8 Metro Application, however when I try to delete the SVG nodes in the DOM it crashes with the following message:
     
    The program '[1516] WWAHost.exe' has exited with code -1073741819 (0xc0000005).
     
    There seems to be bug in the removeChild method or am I doing something wrong?
     
    The Html and JavaScript files are attached below, I have also uploaded the entire project on skydrive:

    https://skydrive.live.com/?cid=3dc6681f40c57df4&sc=documents&id=3DC6681F40C57DF4%21576

    <!-- ****************** Html File Start ***************** -->
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8" />
    <title>WinWebApp2</title>
    <!-- WinJS references -->
    <link rel="stylesheet" href="/winjs/css/ui-light.css" />
    <script src="/winjs/js/base.js"></script>
    <script src="/winjs/js/wwaapp.js"></script>
    <!-- WinWebApp2 references -->
    <link rel="stylesheet" href="/css/default.css" />
    <script src="/js/default.js"></script>
    </head>
    <body>
    <svg id="mapSVG" width="300px" height="300px" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
    <defs>
    <marker id="Startdot" viewBox="0 0 4 4"
    refX="-.75" refY="4.5"
    markerWidth="4" markerHeight="4"
    orient="auto">
    <image x="0" y="0" width="4" height="4"
    xlink:href="images/smalllogo.png" />
    </marker>
    <marker id="Selection" viewBox="0 0 10 10"
    	refX="3.65" refY="7"
    	markerWidth="10" markerHeight="10"
    	orient="auto">
    	<image x="0" y="0" width="8" height="8"
    		xlink:href="images/smalllogo.png" />
    </marker>
    <marker id="StartMidTop" viewBox="0 0 4 4"
    	refX="-.35" refY="4.5"
    	markerWidth="4" markerHeight="4"
    	orient="90">
    	<image x="0" y="0" width="4" height="4"
    	xlink:href="images/smalllogo.png" />
    
    
    
    </marker>
    
    <marker id="StartMidBottom" viewBox="0 0 4 4"
    
    refX="-.35" refY="4.5"
    
    markerWidth="4" markerHeight="4"
    
    orient="5">
    
    <image x="0" y="0" width="4" height="4"
    
    xlink:href="images/smalllogo.png" />
    
    
    
    </marker>
    
    <marker id="Enddot"
    
    viewBox="0 0 10 10" refX="8.5" refY="4.5"
    
    markerUnits="strokeWidth"
    
    markerWidth="5" markerHeight="5"
    
    orient="auto">
    
    <!-- <path class="enddotMarkerPath" d="M 0 2 L 5 4.5 L 0 7 z" />-->
    
    <circle class="enddotMarkerPath" cx="5" cy="5" r="1.25" />
    
    </marker>
    
    <marker id="Endpoint"
    
    viewBox="0 0 15 15" refX="7.7" refY="4.5"
    
    markerUnits="strokeWidth"
    
    markerWidth="4" markerHeight="4"
    
    orient="auto">
    
    <path class="endpointMarkerPath" d="M 0 2 L 5 4.5 L 0 7 z" />
    
    <path class="endpointMarkerPath" d="M 10 1 L 10 10" transform="scale(.5, 2.3) translate(13,-5.9)" />
    
    </marker>
    
    </defs>
    
    
    
    <g id="container">
    
    <g>
    
    <path class="pointNodePath" d="M 0 100 H 500 " fill="none" stroke="black" stroke-width="5" marker-start="url(#Startdot)" marker-end="url(#Enddot)"/>
    
    <text class="pointNodeText" x="2" y="110" fill="black" >point name 1</text>
    
    </g>
    
    
    
    <g>
    
    <path d="m 500 100 h 100 " fill="none" stroke="black" stroke-width="5" marker-start="url(#Startdot)" marker-end="url(#Selection)"/>
    
    <text x="502" y="110" fill="black">point Name 2</text>
    
    </g>
    
    
    
    <g>
    
    <path class="pointNodePath" d="m 600 100 v 50 h 100 " fill="none" stroke="black" stroke-width="5" marker-mid="url(#StartMidBottom)" marker-end="url(#Selection)"/>
    
    <text class="pointNodeText" x="602" y="160" fill="black">point Name 3</text>
    
    </g>
    <g>
    <path class="pointNodePath" d="m 600 70 v -25 h 100 " fill="none" stroke="black" stroke-width="5" marker-mid="url(#StartMidTop)" marker-end="url(#Endpoint)"/>
    <text class="pointNodeText" x="602" y="42" fill="black">point Name 4</text>
    </g>
    <g>
    <path class="pointNodePath" d="m 600 100 h 100 " fill="none" stroke="black" stroke-width="5" marker-start="url(#Startdot)" marker-end="url(#Selection)"/>
    <text class="pointNodeText" x="602" y="110" fill="black">point Name 5</text>
    </g>
    </g>
    </svg>
    <button id="clearTree">Clear SVG Button</button>
    </body>
    </html>
     
    <!-- ****************** Html File End  ***************** -->
     
    // ******************* JavaScript File Start ***************
    (function () {
    
    'use strict';
     
    
    WinJS.Application.onmainwindowactivated = function (e) {
    
    if (e.detail.kind === Windows.ApplicationModel.Activation.ActivationKind.launch) {
    
    // TODO: startup code here
    
    document.getElementById("clearTree").addEventListener("click", clear, false);
    
    }
    
    }
    
    function clear() {
    
    var container = document.getElementById("container");
    
    while (container.firstChild) {
    
    container.removeChild(container.firstChild);
    
    }
    
    }
    WinJS.Application.start();
    })();
    
    // ******************* JavaScript File End ***************
    
    


     


    Kamran Shahid Senior Software Engineer/Analyst (MCP,MCAD,MCSD.NET,MCTS,MCPD.net[web])
    Saturday, November 5, 2011 8:15 PM
  • This is a bug in Internet Explorer 10 that reproduces outside of metro.  It has something to do with this element: <marker id="Endpoint"

    I filed a bug with the IE team.  Thanks for Reporting this!

    -Jeff

     

     


    Jeff Sanders (MSFT)
    Monday, November 7, 2011 3:20 PM
    Moderator