Texbox in html5 캔버스

HTML5를 사용하여 캔버스 안에 텍스트 상자를 삽입 할 수 있습니까? 그렇다면 캔버스 안에 텍스트 상자를 삽입하는 방법을 알려주십시오. 현재 직사각형을 사용하여 기능을 구현하고 있지만 기대하는 바가 아니므로 HTML 5에서 KINETICJS를 사용하여 텍스트 상자를 만들 수 있도록 도와주세요.Texbox in html5 캔버스

출처

2012-07-24 Villan

정말 간단합니다.

div 안에 텍스트 상자를 넣고 div 위치를 변경해야합니다. 당신의 머리 태그에서

<body> 
    <form id="form1" runat="server"> 
     <div id="mytext"> 
      <asp:TextBox ID="txtTest" runat="server"></asp:TextBox> 
     </div> .....

<head id="Head1" runat="server"> 
    <style type="text/css"> 
     #mytext { 
      position: absolute; 
      left: 36%; 
      top: 725px; 
      z-index: 999; 
     } 
    </style>

왼쪽과 최고 값을 변경하여 당신은 당신의 캔버스에 텍스트 상자를 배치 할 수 있습니다 당신의 몸 태그에서이 작업을 수행하기 위해.

출처

2012-07-31 15:23:19

아니요. 입력 또는 텍스트 영역을 canvas 요소가 내부에있는 것처럼 보이지만 캔바스는 자바 스크립트를 통해 픽셀을 칠하는 공간이므로 입력을 캔바스에 포함 할 수있는 방법이 없습니다.

일부 브라우저에서는 입력을 SVG에 삽입 할 수 있으며, 변환 (회전, 전단 등)이 가능할 수도 있습니다.

출처

2012-07-24 04:15:08

멋진 @ 스티브 젠슨 – Villan

우리가 (당신은 ['foreignObject']을 사용하여 SVG에 HTML을 포함 할 수 있습니다 캔버스 – Villan

내부 텍스트 상자에 대해 배울 수있는 소스 링크를 얻을 수 있습니다 https://developer.mozilla.org/en/SVG/Element/ foreignObject) 변환이 적용되어야합니다. – robertc

Texbox in html5 캔버스

답변

관련 문제