Question

我正在使用Jquery .keyup和.val来抓取我在表单输入中输入的内容。然后我将值放在变量中。我画了一个圆圈到我用raphael创建的一些纸上。我想基于apon我使用表单输入创建的变量来修改路径。现在我可以将数字输入放入输入字段，并绘制不同的圆形大小。我想要做的是更改路径var path = paper.path("M 250 250 l 0 -50 l -10 0 l 0 50 z" );上的一个点，其中包含所输入内容的值，使其看起来像var path = paper.path("M 200 250 l 0 -50 l -10 0 l 0 value z" );

因此当您在输入字段中输入100到100时，第一个var路径应该更改其中一个点。现在它什么都不做。

我最终尝试做的是有一个进度条，根据输入三个不同输入字段的内容来改变大小。如果有其他方法，我会完全开放。

http://jsfiddle.net/anderskitson/XPwrj/1/

var paper = new Raphael(document.getElementById('canvas_container'), 500, 500);
  $("input").keyup(function () {
        var value = $(this).val();

        //var paper = Raphael(10, 50, 320, 200);
          var circle = paper.circle(50, 40, value);
          var path = paper.path("M 200 250 l 0 -50 l -10 0 l 0 value  z"  );
          var path = paper.path("M 250 250 l 0 -50 l -10 0 l 0 50  z"  );
          /*path.animate({  
            path: "M 250 250 l 0 -100 l -10 0 l 0 100  z"  
        }, 5000, 'elastic');*/

      }).keyup();

Answer 1

您的代码使用“value”作为字符串的一部分，而不是变量。将您的路径代码更改为

var path = paper.path("M 200 250 l 0 -50 l -10 0 l 0 "+value+"  z"  );

基于表单输入的raphael js chaning路径

1 个答案: