1 réponse
Bonjour,
je ne peux pas répondre à ta question mais je peux cependant te fournir un code que j'ai fais pour obtenir facilement les coordonnées d'une découpe d'image. Le voici (tu dois juste changer le chemin de l'image à la fin):
Tu obtiens donc les coordonnées que tu dois ensuite mettre dans la balise area ;-)
A+
Gaerebut
je ne peux pas répondre à ta question mais je peux cependant te fournir un code que j'ai fais pour obtenir facilement les coordonnées d'une découpe d'image. Le voici (tu dois juste changer le chemin de l'image à la fin):
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Obtenir les coordonné interne de l'image à chaque clique</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
var Ax = '';
var Ay = '';
var Bx = '';
var By = '';
var currentPoint = 'A';
function getCoord(e){
var coord = document.getElementById('coord');
var X = e.clientX;
var Y = e.clientY;
if(coord.innerHTML == '')
coord.innerHTML = X + ',' + Y;
else
coord.innerHTML += ',' + X + ',' + Y;
if(currentPoint == 'A'){
Ax = X;
Ay = Y;
currentPoint = 'B';
}
else{
Bx = X;
By = Y;
currentPoint = 'A';
}
if(Ax != '' && Ay != '' && Bx != '' && By != ''){
var line = '';
var lineLength = Math.sqrt((Ax-Bx)*(Ax-Bx)+(Ay-By)*(Ay-By));
for(var i=0;i<lineLength;i++){
line += "<div style='position:absolute;left:"+Math.round(Ax+(Bx-Ax)*i/lineLength)+"px;top:"+Math.round(Ay+(By-Ay)*i/lineLength)+"px;width:1px;height:1px;background:#00D4FF'></div>";
}
document.body.innerHTML += line;
}
}
</script>
</head>
<body style="margin: 0; padding: 0;">
<img src="TON_IMAGE.PNG" alt="Image" title="Cliquer sur l'image pour dessiner un tracé de coordonné" id="pic" onclick="getCoord(event)" border="0" style="cursor: crosshair">
<div id="coord"></div>
</body>
</html>
Tu obtiens donc les coordonnées que tu dois ensuite mettre dans la balise area ;-)
A+
Gaerebut
