1

下の画像のような折れ線グラフを作成しようとしています。 折れ線グラフ

非常に軽量 (kb 単位) である必要があり、ホバーできるポイントが必要です (画像のように、そのポイントに関するツールチップ用)。円グラフなどは必要ありません。上記のような折れ線グラフだけです。

キャンバスを知らないので、キャンバスで必要なことをしようとするとかなり複雑になると思います。私はjQueryをかなりよく知っています。

私は疑問に思っています:画像のように必要最低限​​のことだけを実行できる非常に軽量なフレームワーク/プラグインはありますか? そうでない場合、jQuery を使用してこれを行うことをどのように提案しますか?

必要なのは、ホバーをトリガーできるポイントを含む描画された線だけです。ツールチップなどを処理できます。グリッドと一致するすべての線を描画する方法を見つけようとしています。小さな円の要素を正しい位置に配置します。

本当にありがとう。ps:私にとって軽量は数kb以下です.インタラクティブにしたいからです(静止画像だけではありません)が、巨大なjqueryプラグインが必要なほど多くはありません.小さな何か。

また、応答性が高く、電話の画面に合わせて縮小されるようにしようとしています。

4

5 に答える 5

1

SVGはあなたが探しているものと同じように聞こえます。JQuery SVGやRaphael(Prototype.jsに基づく)などのライブラリを使用すると、簡単に使用できます。

于 2012-04-03T23:45:43.503 に答える
1

Google Chart API は非常に堅牢で使いやすいです。簡単な折れ線グラフの例を次に示し ます http://code.google.com/apis/ajax/playground/?type=visualization#line_chart

作成したチャートを操作することもできます:

https://google-developers.appspot.com/chart/interactive/docs/basic_interactivity

https://google-developers.appspot.com/chart/interactive/docs/events

于 2012-04-04T00:46:46.283 に答える
0

私はあなたがあなたが望むことをすることができるかもしれないどれほど軽量であるかわかりません、そのようなことのために私は通常flotを使います。

于 2012-04-03T23:41:43.153 に答える
0

GoogleChartsをチェックしてください。それは完璧なもののように見えます。フラッシュを使用しないため、一部よりも小さく、ツールチップがあります。ボーナスとして、Web上のライブデータを使用できます。

于 2012-04-04T00:43:27.247 に答える
0

グラフの操作を計画していない場合。pChartという PHP ライブラリを使用する

于 2012-04-04T00:09:51.020 に答える