javascript - jqplot蛍光ペンマウスがその上にあるときの線

Question

jqplotを使用して複数のラインプロットを生成していますが、それにハイライト機能を追加したいと思います。詳細には、マウスがこの線上にあると、それ自体が強調表示されます（色が変わります）。この機能は棒グラフで確認できます（例）。これを折れ線グラフに導入する方法はありますか？

これが私のコードのデモです。

Answer 1

この機能は、少なくとも私の知る限り、。によって箱から出して提供されるものではありませんjqPlot。このため、「最も簡単な」のは自分で追加することです。私はしばらく前にこの種のことをしました。私のアプローチは、jqplotMouseMoveイベントを使用して、そこに適切な機能を追加することでした。

私のアプローチの考え方は単純です：

1. 線分からマウスポイントまでの距離を取得します。
2. 次に、それが線の幅よりも小さい場合-あなたはあなたの線を見つけました。
3. 蛍光ペンのキャンバス（.jqplot-highlight-canvas）に異なる色で線を引き、ハイライト効果を作成します。このキャンバスには、蛍光ペンプラグインが必要です。

前述のアイデアの実用的なサンプルはこちらです。

PS：点と直線の距離関数を使用してくれたJonas Raoni Soares Silvaに感謝します。これにより、多くの時間を節約でき、うまく機能します。