텍스트 필드의 값을 HTML 캔버스로 전달

Question

텍스트 필드의 좌표를 HTML5 캔버스로 전달하려고합니다. 아래 코드를 사용하여 캔버스에 직사각형을 그립니다. 공동 좌표는 내가 변수 objectCoordinates로 전달 시도했지만 사각형이 그려지지 않습니다 0,0,50,50

function displayObject(currentObject){ 
    var imageNumber = $(currentObject).find('div.objectDd input.objectImageNum').val(); 
    var objectCoordinates = $(currentObject).find('div.objectDd input.objectCoordinates').val(); 
    var imageId = ""; 
    var canvasId = ""; 
    var context = ""; 
    var canvas = ""; 


    if(imageNumber != "" && objectCoordinates != ""){ 
     imageId = "#imgNum".concat(imageNumber); 
     canvasId = $('#objectData').find('#miImages '+imageId+' .imageContainer canvas').attr("id"); 
     canvas = document.getElementById(canvasId); 
     context = canvas.getContext("2d"); 
     context.fillStyle = "#FF0000"; 
     context.fillRect(objectCoordinates); 
    } 
} 

해야한다.

사용자가 입력 한 내용을 어떻게 좌표로 전달할 수 있습니까?

Answer 1

바로 지금 objectCoordinates는 문자열입니다. 문자열을 사용하여 변수, 특히 사람을 초기화 할 필요가 없습니다, 또한

context.fillRect(coordinateArray[0], 
       coordinateArray[1], 
       coordinateArray[2], 
       coordinateArray[3]) 

을 : 하나 하나에 전달할 다음

var coordinateArray = objectCoordinates.split(",") 

그리고 : 당신은 사용자가 전달되는 숫자를 추출해야 마치 문자열이 아닌 캔버스와 컨텍스트와 비슷합니다.