Detect mouseover and show tooltip text for dots on an HTML Canvas
Posted
by
carl asquith
on Stack Overflow
See other posts from Stack Overflow
or by carl asquith
Published on 2011-01-11T09:20:28Z
Indexed on
2011/01/12
14:54 UTC
Read the original article
Hit count: 200
Ive recently created a "map" although not very sophisticated (im working on it) it has the basic function and is generally heading in the right direction.
If you look at it you can see a tiny red dots and on those tiny red dots i want to mouseover it and see text basically but ive had a bit of trouble getting the code right.
http://hummingbird2.x10.mx/website%20creation/mainpage.htm
This is all the code so far.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Oynx Warrior</title>
<link rel="stylesheet" type="text/css" href="mystyle.css" />
</head>
<body>
<h1>Oynx Warrior</h1>
<canvas id="myCanvas" width="500" height="500" style="border:1px solid #c3c3c3;">
Your browser does not support the canvas element.
</canvas>
<script type="text/javascript">
var c=document.getElementById("myCanvas");
var cxt=c.getContext("2d");
cxt.fillStyle="#red";
cxt.beginPath();
cxt.arc(50,50,1,0,Math.PI*2,true);
cxt.closePath();
cxt.fill();
</script>
</body>
</html>
© Stack Overflow or respective owner
