Как нарисовать текст на холсте, используя HTML и JS?

У меня есть 3 детские игры. Все они - трассировка / зарисовка. Игра заключается в наброске линий, букв и цифр.

Я уже начал рисовать линии и использовал sketch.js из http://intridea.github.io/sketch.js/, который на самом деле не работает на 100%.

Теперь мой вопрос, как это сделать с помощью букв и цифр.

Я создал образец, но он на самом деле не работает. Так что игра такая. есть буква "А", тогда пользователь (ребенок) проследит, что А. Но в моем примере письмо исчезнет. Так что, если пользователь уже проследил / нарисовал его, появится кнопка "Далее".

<!DOCTYPE html>
<html>
<body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://intridea.github.com/sketch.js/lib/sketch.min.js"></script>

<canvas id="myCanvas" width="200" height="300"
style="border:1px solid #d3d3d3;">
Your browser does not support the canvas element.
</canvas>

<script>
var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");
ctx.font = "150px Arial";
ctx.strokeText("A",20,200);
    $('#myCanvas').sketch({
      defaultColor: "#ff0000", 
      defaultSize: 10
    });
</script>

</body>
</html>

0 ответов

Другие вопросы по тегам