JavaScript: перетаскивание элемента пути делает его недоступным - PullRequest
Новая
       5

JavaScript: перетаскивание элемента пути делает его недоступным

0 голосов
/ 11 февраля 2019

У меня есть два элемента в моем тестовом коде.Элемент закрытого пути и элемент прямоугольника.Я использую библиотеку svg.draggable.js для перетаскивания обоих элементов.Прямоугольный элемент выглядит хорошо перетаскиваемым, но элемент пути исчезает, когда я нажимаю на него и пытаюсь его перетащить.Может кто-нибудь объяснить, что происходит и как я могу сделать элемент пути перетаскиваемым? 

< body >
  <
  div id = "curve" >
  <
  /div> <
div id = "drawing" > < /div> <
script id = "jscript" >
  var r = SVG('drawing').size(500, 500);
var p = r.path().attr({
  id: 'path0',
  padding: '0px',
  fill: 'blue',
  d: 'M0 0 C100 120 150 120 150 100z',
  stroke: {
    color: 'black',
    width: 1,
    padding: '1px'
  }
}).draggable();

var b = r.rect().attr({
  id: 'rect0',
  x: 300,
  y: 300,
  height: 30,
  width: 30,
  fill: 'red'
}).draggable(); <
/script> < /
body >
<!DOCTYPE html>

<head>
  <meta charset=utf-8 />
  <title>JS Bin</title>
  <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" crossorigin="anonymous"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" crossorigin="anonymous">
  </script>
  <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" crossorigin="anonymous"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/svg.js/2.6.5/svg.js"></script>
  <script src="file:///C:/Users/angular2/Downloads/svg.draggable.js/dist/svg.draggable.js">
    <!-- It does not appear there is any cdns location for svg.draggable.js library online. You will need to download it and install it locally if you would like to test the code -->
  </script>
</head>

1 Ответ

0 голосов
/ 14 февраля 2019

Я смог решить проблему, создав вложенную группу, поместив элемент пути во вложенную группу, а затем сделав вложенную группу перетаскиваемой, а не отдельным элементом.

...