私のページにはいくつかのグラフがあります。ユーザーがカーソルを写真の上にドラッグすると、グラフの上に水平線を表示したいと思います。
上の図は開始点であり、後者はユーザーがカーソルをグラフの上に置いたときに何が起こるかを示しています。線が画像上にある場合、線はカーソルと同じレベルに留まる必要があります。
たとえば、これはJavascriptで可能ですか?
私のページにはいくつかのグラフがあります。ユーザーがカーソルを写真の上にドラッグすると、グラフの上に水平線を表示したいと思います。
上の図は開始点であり、後者はユーザーがカーソルをグラフの上に置いたときに何が起こるかを示しています。線が画像上にある場合、線はカーソルと同じレベルに留まる必要があります。
たとえば、これはJavascriptで可能ですか?
たとえば、カーソルの Y 値に 1px の緑の境界線で配置された div ボックスが必要です。位置は絶対に設定する必要があります。ただし、画像に直接ペイントすることはできません。
D3 を使用し、svg に基づいてグラフとホバー ラインを描画することができます。他のグラフ コンポーネントを追加して、拡大するサブ間隔を選択したり、ラベルを変更したりするなど、相互作用することもできます。
これを開発の例として取り上げます: http://mpf.vis.ywng.cloudbees.net/
(黄色のバーをドラッグして、凡例をクリックできます。ソース コードについては、github で fork me をクリックしてください)