Solved
How can I setup a simple draw app using tml text widget?
I need to setup a simple draw app in Vuforia studio. Is there any way that i can use tml text widget? I need to get a simple drawing app in vuforia without using the chalk widget.
For reference i have attached the html code for the drawing app i need in vuforia. Is there any way i can run this code in vuforia using tml text widget?
<html>
<body style='margin: 1;'>
<canvas id="canvas" style="display: block;">
Sorry, your browser is rubbish.
</canvas>
<script type="text/javascript">
var canvas = document.getElementById('canvas');
var context = canvas.getContext('2d');
var radius = 5; //不要犯蠢，第一次竟然打成0，根本就不會有東西跑出來啊
var start = 0; //起始點
var end = Math.PI * 2; //結束點
var dragging = false;
canvas.width = window.innerWidth; //設定canvas的寬
canvas.height = window.innerHeight; //設定canvas的高
context.lineWidth = radius * 2; //試著改變參數，會發現裡頭有線連著
var putPoint = function(e){
if(dragging){
context.lineTo(e.offsetX, e.offsetY);
context.stroke();
context.beginPath(); //請把這條beginPath到fill一起看
context.arc(e.offsetX, e.offsetY, radius, start, end);
context.fill(); //填滿它
context.beginPath();
context.moveTo(e.offsetX, e.offsetY);
}
}
var engage = function(e){
dragging = true;
putPoint(e);
}
var disengage = function(){
dragging = false;
context.beginPath();
}
canvas.addEventListener('mousedown', engage);
canvas.addEventListener('mousemove', putPoint);//當有人在canvas上mousedown時觸發putPoint
canvas.addEventListener('mouseup', disengage);
</script>
</body>
</html>any suggestion to do it in any other way than using tml text widget is also welcome.