перетаскивание одной стороны пути в Raphael 2.0 - PullRequest
Новая
       1

перетаскивание одной стороны пути в Raphael 2.0

0 голосов
/ 09 марта 2012

Я читаю файл JSON и элемент foreach. Я создаю путь и круг.Мне нужно, чтобы путь тянулся по кругу.Путь заканчивается точными координатами x, y центра круга.Я только хочу, чтобы конец круга перетаскивался с кружком.Другой конец пути исправлен.

У меня есть перетаскивание, работающее для кругов, но оно ничего не делает для путей.Я разместил код, который не используется и не содержит информации для позиционирования кругов.Мне нужна только помощь с перетаскиванием одного конца пути.Мой сценарий хорошо читает JSON и рисует холст с кругами и путями в правильных координатах.Заранее благодарен за помощь.

Я не отвечаю на вопросы, требующие дополнительного плагина, пожалуйста. 

<script type="text/javascript">

$.getJSON('jsonScript.php?view=json', function( json ){

 var start = function () {
       this.ox = this.attr("cx");
       this.oy = this.attr("cy");
       this.animate();
     },
     move = function (dx, dy) {
             this.attr({cx: this.ox + dx, cy: this.oy + dy});
     },
     up = function () {
             this.animate();
  };

  var paper = Raphael( canvas.leftMargin, canvas.topMargin, canvas.width, canvas.height );

  $.each( json, function( a , z ) {

    var circleObj = paper.circle( x, y, radius );
    circleObj.attr({"fill":"black","stroke":"red","stroke-width":5});
    circleObj.node.id = jsonVar;

    var pathObj = paper.path( "M396,16L641,187" );
    path.attr({"stroke":"#fdfdfd","stroke-width":3}).toBack();

    paper.set( circleObj, pathObj ).drag( move, start, up ) 

  });
});

</script>

1 Ответ

2 голосов
/ 12 марта 2012

Вы можете прикрепить path к circleObject, просто назначив его в вашем блоке .each ... 

$.each(json, function(a, z) {
  ...
  circleObject.path = path;
});

Таким образом, вы можете получить к нему доступ из функций запуска, перемещения и вверх ... 

 move = function (dx, dy) {
         this.path.attr(path)[1][1] = this.ox + dx;
         this.path.attr(path)[1][2] = this.oy + dy;
 },
...