d3 события мыши не работают

Question

У меня возникли проблемы с запуском событий d3 на mousedown, mouseup и mousemove. Код не работает, когда я перемещаю его на рабочий сервер (в противном случае он отлично работает с простым index.html и только с jquery и d3-библиотеками). В рабочей папке существуют другие библиотеки для перетаскиваемых элементов, которые не имеют ничего общего с реализацией svg и d3, которые я пытаюсь сделать здесь. Я просто думаю, что они могут быть возможными причинами конфликта с событиями мыши: (Любая помощь будет оценена)

Здесь мой код (который отлично работает за пределами производственной среды): Я пытаюсь нарисовать линию на ходу мыши:

var container = d3.select('svg'); 

    function draw(selection){ 
     var xy0, 
      path, 
      keep = false, 
      line = d3.svg.line() 
        .x(function(d){ return d[0]; }) 
        .y(function(d){ return d[1]; }); 
     selection 
      .on('mousedown', function(){  

      console.log("100") 

       console.log('THIS', this) 
       keep = true;      
       xy0 = d3.mouse(this); 
       console.log('xy0', xy0) 
       path = d3.select('svg') 
         .append('path') 
         .attr('d', line([xy0, xy0])) 
         .style({'stroke': 'red', 'stroke-width': '3px'}); 

         console.log(path) 


      }) 
      .on('mouseup', function(){ 
       var xUp = d3.mouse(this); 

       console.log('xUp', xUp) 

       keep = false; 
      }) 
      .on('mousemove', function(){ 
       if (keep) { 
        Line = line([xy0, d3.mouse(this) 
           .map(function(x){ return x - 1; })]); 
        console.log(Line); 
        path.attr('d', Line); 
       } 

       var xMove = d3.mouse(this); 

        console.log('x', xMove[0]); 
        console.log('y', xMove[1]); 

       console.log('xMove', xMove) 
      }); 
    } 

d3.select('svg').call(draw); 

А вот HTML

  <image xlink:href="dot.svg" x="7%" y="35%" height="20px" width="20px"></image> 
      <image xlink:href="dot.svg" x="36%" y="35%" height="20px" width="20px"></image> 
      <image xlink:href="dot.svg" x="65%" y="35%" height="20px" width="20px"></image> 


      <image xlink:href="dot.svg" x="7%" y="70%" height="20px" width="20px"></image> 
      <image xlink:href="dot.svg" x="36%" y="70%" height="20px" width="20px"></image> 
      <image xlink:href="dot.svg" x="65%" y="70%" height="20px" width="20px"></image> 

     </svg> 

Answer 1

Решенный. В одном и том же представлении был перетаскиваемый компонент, который при удалении оставил проблему выше. Который оставил меня в виду, может возникнуть конфликт между событиями мыши d3 и jQuery.