Я работаю с некоторыми манипуляциями с изображением, и я пытаюсь создать базовый холст, и у меня теперь есть текстовое поле. Если я ввожу любой текст, он должен немедленно измениться на холсте, и мне нужен этот текст для перемещения на холсте и записи.это позиции X и Y. Так как мне это сделать?
Вот мой код:
<!DOCTYPE html>
<html>
<head>
<title>HTML5 Canvas</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript">
var drawLogo = function () {
var canvas = document.getElementById('my_canvas');
var context = canvas.getContext('2d');
context.font = 'italic 40px sans-serif';
context.textBaseline = 'top';
context.fillText('Some text', 60, 0);
};
$(function () {
var canvas = document.getElementById('my_canvas');
if (canvas.getContext) {
drawLogo();
}
});
</script>
</head>
<body>
<canvas id="my_canvas" width="900" height="300">
Fallback content here
</canvas>
<input id="Text1" type="text" />
</body>
</html>