Du kan tegne en cirkel med VML, men det er dårligt understøttet.
Jeg lavede en gang sådan noget fis her :)
<HTML XMLNS:v="urn:schemas-microsoft-com:vml">
<html>
<head>
<title>Nikolajdu Tegner</title>
<style>
v\:* { behavior: url(#default#VML); }
.top { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; background-color:teal; color: #33CCFF; text-decoration: none;}
</style>
<SCRIPT LANGUAGE="JavaScript">
var Ymouse = Xmouse = 0;
var klik = 0;
var formen = "streg";
function init(){
document.f.minForm.value=formen
function Mouse( evnt ) {
Ymouse=event.y;
Xmouse=event.x;
document.forms.f.Xpos.value=Xmouse;
document.forms.f.Ypos.value=Ymouse;
};
document.onmousemove=Mouse;
function left(evnt) {
if (event.button==1 && Ymouse>=30)
tegn()
}
document.onmousedown=left;
}
function tegn(){
if (klik==0){
tempX = Xmouse;
tempY = Ymouse;
document.getElementById('start').style.visibility="visible"
document.getElementById('start').style.left=tempX
document.getElementById('start').style.top=tempY
klik++
}else if (formen=="streg"){
document.getElementById('start').style.visibility="hidden"
document.getElementById('tegnHer').innerHTML+='<v:POLYLINE style="Z-INDEX:1;CURSOR:crosshair;POSITION:absolute;antialias:true" points="'+tempX+','+tempY+','+Xmouse+','+Ymouse+'"></v:POLYLINE>';
tempX = Xmouse;
tempY = Ymouse;
}else if(formen=="cirkel" && Xmouse>tempX&&Ymouse>tempY){
document.getElementById('start').style.visibility="hidden"
myWidth = Xmouse-tempX;
myHeight = Ymouse-tempY;
document.getElementById('tegnHer').innerHTML+='<v:oval style="position:absolute;top:'+tempY+';left:'+tempX+';width:'+myWidth+'pt;height:'+myHeight+'pt" fillcolor="red"></v:oval>'
tempX = Xmouse;
tempY = Ymouse;
klik = 0;
}else if(formen=="firkant" && Xmouse>tempX&&Ymouse>tempY){
document.getElementById('start').style.visibility="hidden"
myWidth = Xmouse-tempX;
myHeight = Ymouse-tempY;
document.getElementById('tegnHer').innerHTML+='<v:rect fillcolor="green" style="position:absolute;top:'+tempY+';left:'+tempX+';width:'+myWidth+'pt;height:'+myHeight+'pt"></v:rect>'
tempX = Xmouse;
tempY = Ymouse;
klik = 0;
}else if(Xmouse<tempX||Ymouse<tempY){
alert('Det kan ikke lave en negativ figur her')
document.getElementById('start').style.visibility="hidden"
klik = 0;
}
}
</script>
</head>
<body bgcolor="Teal" scroll=no onLoad="init()" scroll=no leftmargin="0" marginheight="0" marginwidth="0">
<script>
document.write('<div style="position:absolute;top:0;left:0;width:'+document.body.clientWidth+';height:10;background-color:#999999;">')
document.write('<form name="f">');
document.write('<input type="button" class="top" size=5 value="Streg" onClick="klik=0;formen=\'streg\';document.f.minForm.value=formen">')
document.write('<input type="button" class="top" size=5 value="Cirkel" onClick="klik=0;formen=\'cirkel\';document.f.minForm.value=formen">')
document.write('<input type="button" class="top" size=5 value="Firkant" onClick="klik=0;formen=\'firkant\';document.f.minForm.value=formen">')
document.write('<input type="text" class="top" name="minForm" size=5 onfocus="this.blur()">')
document.write('<input type="text" class="top" name="Xpos" size=5 onfocus="this.blur()">')
document.write('<input type="text" class="top" name="Ypos" size=5 onfocus="this.blur()">')
document.write('</form>')
document.write('</div>')
</script>
<div ID="tegnHer" style="position:absolute;top:20;left:0"><div>
<div ID="start" style="position:absolute;top:20;left:0;visibility:hidden;">x<div>
</body>
</html>
<br><br>
