2010-03-20 7 views
3

저는 HTML5 캔버스가 무엇인지 혼란 스럽습니다. 자바 스크립트라고 들었지만 훨씬 더 큰 거래가있는 것 같습니까?HTML5 캔버스 란 무엇입니까?

  1. 무엇이 javascript와 다른가요?

  2. 왜 그렇게 놀라운가요?

  3. JavaScript 이외의 기능을 수행합니까?

답변

5

난 당신이 문서

그러나 짧은 HTML5 Canvas - the basics을 읽으십시오. 그것은 자바 스크립트를 대체하지 않습니다.

HTML 5 캔버스 당신에게 자바 스크립트를 사용하여 그래픽을 그릴 수있는 쉽고 강력한 방법을 제공합니다. 각 캔버스 요소의 경우 은 페이지를 그리는 JavaScript 명령을 내릴 수있는 "컨텍스트"(도면 패드의 페이지)를 사용할 수 있습니다. 브라우저는 캔버스 컨텍스트를 구현할 수 있으며 다른 API는 그림을 제공합니다 기능을 제공합니다.

5

canvas은 기본적으로 자바 스크립트를 사용하여 그릴 수있는 img 요소입니다.

+0

이러한 평신도 설명에 감사드립니다! lol +1 –

1

Canvas element은 기본적으로 프로그래밍 방식으로 그릴 수있는 그리기 캔버스입니다. 웹용 스크립트 비트 맵 그리기 도구입니다.

필자는 웹 기반 MS 페인트 클론을 손쉽게 만들 수 있다는 점을 제외하면 "놀라운"점은 복잡한 그래픽을 만들기위한 훨씬 더 풍부하고 자유로운 형식의 영역을 가지고 있다는 점입니다 클라이언트 쪽 및 온더 플라이. 예쁜 그래프를 그릴 수도 있고 사진으로 할 수도 있습니다. 당신도 애니메이션을 할 수 있습니다!

Mozilla's Developer Center has a reasonable tutorial 당신이 그것을 밖으로 시도하고 싶다면.

+0

애니메이션 비트는 직접 구현해야하는 것입니다. 캔버스 자체는 프레임이나 움직임을 지원하지 않습니다. –

1

우선 Canvas가 자바 스크립트가 아닙니다. 이 2 가지는 완전히 다른 것입니다.

캔버스는 JavaScript를 사용하여 그래픽, 애니메이션, 그래프, 사진 합성물 또는 다른 시각적 개체를 즉석에서 렌더링하는 데 사용할 수있는 HTML5 요소입니다. 종종 캔버스는 웹 게임 및 온라인 프리젠 테이션을 구축하는 데 사용되었습니다.

0
  • 캔버스 - 우리가 어떻게 같은 (있는 캔버스에 그래픽과 애니메이션을 그리는 데 사용되는 여러 함수를 호출 할 수 있습니다 무엇을 사용하여 객체를 돌려줍니다 - 흰색 종이 같은 사각형 영역 컨텍스트는
  • <html> 
     
         <body> 
     
         <canvas id="c" width="200" height="200" style="border:1px solid"></canvas> 
     
         <script> 
     
          var canvas = document.getElementById("c");//get the canvas in javascript 
     
          var context = canvas.getContext("2d");//getcontext on canvas 
     
          context.beginPath();//start the path.we are going to draw the line 
     
          context.moveTo(20,20);//starting point of Line 
     
          context.lineTo(40,20);//ending point of Line 
     
          context.stroke(); //ink used for drawing Line (Default: Black) 
     
         </script> 
     
         </body> 
     
        </html>
    : 연필 캔버스에 선을 그립니다 다음 예를 참조하십시오

) 용지에 사용된다