동적 텍스트 및 jCanvas 링크

저는 캔버스가 있고 jCanva (http://calebevans.me/projects/jcanvas/docs.php?p=layers)를 사용하여 이벤트가있는 원을 만듭니다.동적 텍스트 및 jCanvas 링크

각 원에는 텍스트 (mouseover 이벤트의 경우) 및 id (click 이벤트의 경우)가 있어야합니다. 문제는 이벤트가 동적이며 "i"가 항상 마지막 i (data.length)이므로 모든 서클에서 동일한 값을 얻습니다. 어떻게 해결할 수 있습니까?

for (i = 0; i < data.length; i++) { 
       var id = data[i][0]; 
       var text = data[i][2]; 

       $("#mapCanvas").drawArc({ 
        layer: true, 
        fillStyle: "yellow", 
        strokeStyle: "#000", 
        strokeWidth: 1, 
        x: Math.random() * c.clientWidth, 
        y: Math.random() * c.clientHeight, 
        radius: 6, 
        click: function (layer) { 
         window.open("Edit/" + id); 
        }, 
        mouseover: function (layer) { 
         $("canvas") 
         .addLayer({ 
          method: "drawRect", 
          name: "BackgroundLabel", 
          group: "ItemLabel", 
          fillStyle: "#FFFFD4", 
          x: layer.x + 10, 
          y: layer.y - 15, 
          width: 100, 
          height: 20 
         }) 
         .drawLayers(); 

         $("#mapCanvas").drawText({ 
         layer: true, 
         fillStyle: "white", 
         strokeWidth: 0, 
         x: layer.x + 10, 
         y: layer.y - 10, 
         font: "14pt Arial, Verdana, sans-serif", 
         text: text 
         }); 
        } 
       });

출처

2012-06-26 TamarG

확인 당신은 당신이 이벤트 핸들러에 인수로 얻을 레이어 객체에 아이디/이름을 밀어하거나 그런 식으로 쓸 수있는 경우 : ' 클릭 ID) { \t \t \t window.open ("편집 /"+ ID) \t \t} })(); ' 각 도면마다 다른 범위를 만들려면 – Bnaya

고정되었으므로 - "drawOneCircle"이라는 분리 함수를 만들어서 vars를 가져 와서 사용했습니다. "drawOneCircle"에는 원래 "for"루프의 내용이 포함됩니다. 구동 문서를 데이터를 생성 http://d3js.org/ 의 멋진하고 작업을 훨씬 쉽게 만들 것입니다 -

  for (i = 0; i < data.length; i++) { 
       var id = data[i][0]; 
       var text = data[i][2]; 
       drawOneCircle(c, id, text); 
      }

출처

2012-06-26 10:17:52 TamarG

나는이 라이브러리를 확인 당신을 위해 무엇을 요구하지만, 정확히 아니다 알고있다. 그리고 svg를 사용하면 캔버스를 사용하면 성능이 향상 될 것입니다.

출처

2012-06-27 18:19:25

@TamarG : "i"가 항상 마지막 i (data.length) 인 이유를 이해하려면 Trevor Burnham이 "Async JavaScript"이라는 책을 적극 추천합니다. 저는 많은 언어로 프로그램을 작성했으며,이 책을 읽을 때까지 JavaScript를 알고 있다고 생각했습니다. JavaScript 이벤트 관리는 직관적이지 않습니다. 이벤트는 내가 사용 해본 다른 언어와 달리 관리됩니다. 나는이 책을 읽을 때까지 그것을 얻지 못했다. ((함수() { \t \t 리턴 기능 :

출처

2012-09-24 16:15:31

동적 텍스트 및 jCanvas 링크

답변

관련 문제