votre fonction

x mini Maxi

y mini y Maxi

Dimensionnement du canevas
height
width

épaisseur trait

couleur trait

Votre navigateur ne supporte pas la balise canvas

 
<!DOCTYPE HTML>
<html lang = "fr">
<head>
	<title>tracer fonction</title>
	<meta charset = "utf-8" />
</head>
<body>
	<canvas id = "schema" height="300" width="300" style="border:1px solid">
   Votre navigateur ne supporte pas la balise canvas
</canvas>
<script>
	var zone_dessin = document.getElementById("schema");
	var graphe= zone_dessin.getContext("2d");
	var compteur=;
	graphe.strokeStyle = "#0098f8";
	graphe.lineWidth=1;
	graphe.beginPath();
		graphe.moveTo(0,f());
		while(compteur<) {
			graphe.lineTo(20*(compteur-()),-(f(compteur)-())*);
			compteur=(compteur+0.05);
		}						
	graphe.stroke();
	function f(x) {
		var y=Math.sin(x);
		return (y);
	}
	graphe.beginPath();
		graphe.lineWidth="1";
		graphe.strokeStyle="black";
		graphe.moveTo(0,zone_dessin.height/2);
		graphe.lineTo(zone_dessin.width,zone_dessin.height/2);
		graphe.lineTo(zone_dessin.width-5,(zone_dessin.height/2)-5);
		graphe.moveTo(zone_dessin.width,zone_dessin.height/2);
		graphe.lineTo(zone_dessin.width-5,(zone_dessin.height/2)+5);
		graphe.moveTo(zone_dessin.width/2,zone_dessin.height);
		graphe.lineTo(zone_dessin.width/2,0);
		graphe.lineTo((zone_dessin.width/2)-5,5);
		graphe.moveTo(zone_dessin.width/2,0);
		graphe.lineTo((zone_dessin.width/2)+5,5);
	graphe.stroke();
	graphe.fillText("",0,10+zone_dessin.height/2);
	graphe.fillText("",zone_dessin.width-20,10+zone_dessin.height/2);
	graphe.fillText("",5+zone_dessin.width/2,-8+zone_dessin.height);
	graphe.fillText("",5+zone_dessin.width/2,8);
	</script>
</body>
</html>