Vorrei realizzare in una pagina un disegno complesso, con forme irregolari cliccabili, che mi lancino ognuna una funzione.
Le forme le realizzo facilmente con canvas
codice:
ctx.moveTo(0,0);
ctx.lineTo(50,80);
ctx.lineTo(30,160);
ctx.lineTo(70,360);
ctx.lineTo(20,360);
ctx.lineTo(0,0);
ctx.fillStyle = "#387014";
ctx.stroke();
ma non viene colorata, e da qui non so nemmeno come lanciare una funzione..
l'alternativa sarebbe usare
codice:
<img src="http://xxxxxxxxxxx.png" alt="The Map" usemap="#mymap" />
<map name="mymap" id="mymap">
<area shape="poly" coords="6, 10, 480, 10, 144,157" onclick="lafunzione();" />
</map>
ma in questo modo avrei un'immagine fissa e quindi colori fissi, mentre io avrei voluto controllarli tramite javascript