Uncaught DOMException: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node. Object.RG.

Share RGraph:   To help my Google visibility (it can't get much worse!), if you like and use RGraph I'd appreciate it if you could link to me

« Back to message list

Enter your email address to get email updates on this topic. You can stop receiving updates by clicking the link in the update email messages.

Posted by Jan Dirk on 31st March 2017
Hello,

In my SVG chart, I get continuously the error

Uncaught DOMException: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node. Object.RG.SVG.removeHighlight

in my browser-console.
I think it is because I multiple charts on one page.

I could fix it by changing the function removeHighlight in RGraph.svg.common.core.js into

     //
     // Removes the highlight from the chart added by tooltips (possibly others too)
     //
     RG.SVG.removeHighlight = function (obj)
     {
         var highlight = RG.SVG.REG.get('highlight');

         if (highlight && RG.SVG.isArray(highlight) && highlight.length) {
             for (var i=0,len=highlight.length; i<len; ++i) {
                   if (highlight[i].parentNode === obj.svg) {
                     obj.svg.removeChild(highlight[i]);
                   }
             }
         } else if (highlight && highlight.parentNode) {
             if (obj.type === 'scatter') {
                 highlight.setAttribute('fill', 'transparent');
             } else {
                 highlight.parentNode.removeChild(highlight);
             }
         }
     };


The patch is:
2907c2907
< if (highlight[i].parentNode) {
---
> if (highlight[i].parentNode === obj.svg) {

Regards,

Jan Dirk
Posted by Richard on 1st April 2017
Hi there,

This one caused the tickmark not to be removed but I have changed the code around that area in the function - so try the next version and see if it changes anything for you.

I used this page to test things:

www.rgraph.net/fiddle/view.html/an-svg-line-chart





Richard
Posted by Jan Dirk on 14th April 2017
Hi Richard,

I've downloaded the RGraph.svg.common.core from www.rgraph.net/libraries/RGraph.svg.common.core.js
(See www.rgraph.net/forum/message.html/gradient-colors-are-gone-after-redraw-20170413084259.html)

I noticed that I still have the issue as I described (Uncaught DOMException: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node. Object.RG.SVG.removeHighlight).

I can reproduce the problem using the following HTML:

<html>
   <head>
     <title>Reproduction case</title>
<!--
     <script src="RGraph/libraries/RGraph.svg.common.core.js"></script>
     <script src="RGraph/libraries/RGraph.svg.common.tooltips.js"></script>
     <script src="RGraph/libraries/RGraph.svg.line.js"></script>
-->
     <script src="www.rgraph.net/libraries/RGraph.svg.common.core.js\"></script>
     <script src="www.rgraph.net/libraries/RGraph.svg.common.tooltips.js\"></script>
     <script src="www.rgraph.net/libraries/RGraph.svg.line.js\"></script>

     <script type="text/javascript">
       window.onload = function()
       {
         var data=[1,2,5,3,4];
         var tooltips=[1,2,5,3,4];
         var options = { tooltips } ;
         (new RGraph.SVG.Line({id: "g1", data: data, options: options})).draw();
         (new RGraph.SVG.Line({id: "g2", data: data, options: options})).draw();
       }
     </script>
   </head>
   <body>
     <div>
       <div id="g1" style="width: 400px; height: 200px; background-color: #eee;" />
     </div>
     <div>
       <div id="g2" style="width: 400px; height: 200px; background-color: #eee;" />
     </div>
   </body>
</html>

When I now make sure that in one of the graphs a tooltip is shown by hovering the graph at the correct points, followed by a click on the other graph, than I get the error.


Regards,

Jan Dirk

Add a reply




« Back to message list