Kuten Ylen sivustolla oleva "Sähkön hinta tänään" kaavio?
https://yle.fi/a/74-20003500
Kun siinä siirtää hiirtä päällä, niin näytetään pystyviivalla kyseisen hetken hinta.
Joku hiiren "hoover"-juttu varmaan käytössä? Millähän hakusanoilla vastaavan tekemiseen löytyisi lisätietoa?
https://yle.fi/a/74-20003500
Kun siinä siirtää hiirtä päällä, niin näytetään pystyviivalla kyseisen hetken hinta.
Joku hiiren "hoover"-juttu varmaan käytössä? Millähän hakusanoilla vastaavan tekemiseen löytyisi lisätietoa?
Vastaukset 4
Vanhimmat
Kyllähän tuo onnistuu vaikka ihan vaan seuraamalla hiiren liikettä (mousemove event) ja piirtämällä kaavio uudestaan aina kun hiiri liikkuu.
Tuossa on näköjään käytetty hienosti SVG:tä niin ei tarvitse koko kaaviota piirrellä uudestaan, muuttaa vain tarvittavien elementtien parametreja.
Ja tuo SVG elementtien parametrien muuttaminen tapahtuu tietenkin JavaScriptillä.
Eli mousemove event joka käynnistää JavaScript pätkän joka muuttaa kaaviota.
Kokeille hirttosilmukkaa!
Hakusanoilla "Google Charts" löytyy ehkä se hakemasi langan pää.
https://developers.google.com/chart