다른 선에서 다른 획 스타일

Question

여러 줄이 필요하지만 스타일이 다릅니다. 그러나 모두 같은 스타일입니다. 감사합니다. .

<script> 
    (function draw_b() { 


      var canvas = document.getElementById("cena3_pontos"); 
      var context = canvas.getContext("2d"); 

      //points 
      context.fillStyle = "#ff0000"; //2 e 6 
      context.fillRect(72,95,2,2); 
      context.fillRect(97,56,2,2); 
      context.fillRect(120,17,2,2); 


      /* 

      Diagonal line,represents points on grahic 

      */ 
      context.beginPath(); 
      context.moveTo(130,5); // diagonal 
      context.lineTo(-50,300);// 

      /* 

      line dashs intersects diagonal line 

      */ 
      context.setLineDash([5,2]) 
      context.strokeStyle = "#ffffff"; 

      /* 

      line width 

      */ 
      context.lineWidth = 1; 
      context.moveTo(50, 97); 


      //line dash // 
      context.lineTo(70,97); 
      context.moveTo(75, 95); 
      context.lineTo(75, 140); 

      context.closePath(); 
      context.stroke(); 

     }()) 
</script> 

Answer 1

context.beginPath와 context.fill 또는 context.stroke 사이의 모든 항목은 정의 된 마지막 스타일을 사용합니다.

예를 들어 beginPath를 정의하고 10 개의 fillStyles를 정의한 다음 채우면 모든 채우기가 10 번째 fillStyle이됩니다.

해결책 : beginPath를 사용하여 각 고유 한 스타일을 시작하십시오.