Simuler un événement de clic sur le chemin de raphael js

Question

J'ai 4 SVG avec plusieurs chemins. J'ai une copie sur ce SVG dans un panneau différent (ce svg n'est pas cliquable). Lorsque je clique sur le chemin SVG cliquable, je remplis le chemin avec une couleur différente.

J'ai créé un bouton pour importer tous les chemins colorés sur le premier SVG dans le second SVG. Pour cela, je dois simuler un événement click sur les bons chemins. Pour trouver le chemin correspondant j'utilise l'attribut d= du chemin.

Voici mon code pour ajouter un événement sur chaque chemin:

function buildEvent(regions, area) { 
    for(var regionName in regions) { 
     (function (region) { 
      region.attr(style); 
      region.node.name = regionName; 
      region.data('clicked', false); 

     region[0].addEventListener("mouseover", function() { 
      if (!region.data('clicked')) region.animate(hoverStyle, animationSpeed); 
     }, true); 

     region[0].addEventListener("mouseout", function() { 
      if (!region.data('clicked')) region.animate(style, animationSpeed); 
     }, true); 

     region[0].addEventListener("click", function() { 
      if (region.data('clicked')) { 
       region.attr("fill", "#ddd"); 
       region.data('clicked', false); 
       json_data[area][region.node.name] = false; 
      }else{ 
       region.attr("fill", "#A8BED5"); 
       region.data('clicked', true); 
       json_data[area][region.node.name] = true; 
      } 
     }, true); 

     })(regions[regionName]); 
    } 
} 

Et voici mon code lorsque je clique sur le bouton d'importation

$('#btn-import').on('click', function() { 

    $('.tab-pane.active svg path').each(function() { 
     if ($(this).attr('fill') == '#A8BED5') { 
      var to_fill = $("#form svg path[d='" + $(this).attr('d') + "']"); 

      // to_fill.trigger('click'); 
      // to_fill[0].trigger('click'); 
      // to_fill.click(); 
      to_fill[0].click(); 
     } 
    }); 
}); 

Comme vous pouvez le voir, j'ai essayé 4 façons de déclencher mon événement de clic. Je ne comprends pas pourquoi l'événement click n'est pas déclenché. la variable to_fill est le bon objet, je pense que je peux obtenir l'attribut fill de mon chemin si je l'ai fait:

console.log(to_fill.attr('fill') // output #dddddd 

Answer 1

Je résolu mon problème. Je l'ai remplacé cette ligne:

region[0].addEventListener("click", function() { 

par cette ligne:

region.node.onclick = function() { 

Et maintenant, je peux utiliser to_fill.trigger('click'); ou to_fill.click();