Canvas Kreis zeichnen?!

[TechLead]

Hey Leute ,
Ich wollte mal fragen ob mir jemand behilflich sein könnte, und zwar müsste ich mithilfe von canvas einen Kreis der durch eine Eingabe von einem Radius erstellt wird , programmieren.
Das alles in Lazarus bzw. Delphi

[florian0]

Ein Thread reicht doch, oder?

[TechLead]

Originally Posted by florian0

Ein Thread reicht doch, oder?

War mir nicht sicher in welcher sub section das rein muss

[IceTrailer]

Siehe
Etwas googlen schadet nie.

[mhaendler]

PHP Code:

<!DOCTYPE html>
<html>
<body>

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

<input type="Number" id="radius" value="2" onChange="drawCircle()" />

<script>

function drawCircle(){
    var c = document.getElementById("myCanvas");
    var ctx = c.getContext("2d");
    var radius = document.getElementById("radius").value;
      
    ctx.clearRect(0, 0, 300, 150); //clear the canvas before redrawing the circle
      
    ctx.beginPath(); //begin drawing
    ctx.arc(100, 75, 50, radius, 2 * Math.PI); //make a curve
    ctx.stroke(); //stop drawing
};

drawCircle();

</script> 

</body>
</html> 


War ne Arbeit von 5 Minuten, hätte man auch mit Googlen wahrscheinlich noch schneller schaffen können...

_
mhaendler

//EDIT Sorry mein Fehler, hab das mit der Sprache überlesen...

[warfley]

Originally Posted by mhaendler

PHP Code:

<!DOCTYPE html>
<html>
<body>

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

<input type="Number" id="radius" value="2" onChange="drawCircle()" />

<script>

function drawCircle(){
    var c = document.getElementById("myCanvas");
    var ctx = c.getContext("2d");
    var radius = document.getElementById("radius").value;
      
    ctx.clearRect(0, 0, 300, 150); //clear the canvas before redrawing the circle
      
    ctx.beginPath(); //begin drawing
    ctx.arc(100, 75, 50, radius, 2 * Math.PI); //make a curve
    ctx.stroke(); //stop drawing
};

drawCircle();

</script> 

</body>
</html> 


War ne Arbeit von 5 Minuten, hätte man auch mit Googlen wahrscheinlich noch schneller schaffen können...

_
mhaendler

Nur leider ist das kein Pascal Code sondern Javascript

[zerogott]