グラファエルを使用してデータの棒グラフを描画していますが、棒グラフにラベルを付ける方法がわかりませんでした。

グラファエルのドキュメントに基づいて、次のようなチャートを描画することになっています。

次に、グラデーションを追加しようとしましたが、人々が次のようにしているのを見ました:

私は試した：

しかし、ブラウザは chart.shades が未定義であると不平を言いました。だから私はそれに変更すればうまくいくかもしれないと決めr.hbarchart({...});ましr.g.hbarchart({...});た。

ただし、現在は rg が未定義であると表示されています。

オンラインで入手できるドキュメントはほとんどありませんが、Raphael.jsとgRaphaelアドオンを使用して、以下に示すグラフを作成する方法を見つけることができました。各データ ポイントにホバリングしているときに表示されるタグのスタイルをどのように設定できるかについて、かなり混乱しています。テキストの周りにパディングを追加するにはどうすればよいですか?

現在の様子は次のとおりです。

コード：

グラファエルによって作成された円グラフがあります

このアイテムの凡例/データを更新したいのですが、解決策が見つかりません。

バックグラウンド

動的な円グラフが機能するグラフの例を取得できました。しかし、構文を理解するのに問題があります...

この例では 2 つの HTML リンクが渡され、リンクが 2 つのラベルと 2 つの特定のパイのスライスに関連付けられているように見えますが、「piechart」メソッドに渡される文字列でこれらの相関または関連付けがどのように発生するかは明らかではありません。さらにいくつかのリンクを渡そうとしましたが、コードはリンクをランダムにラベルに関連付けているようです。Link1 が常に Label1 に関連付けられていることを確認する明確な方法はないようです。

質問

コードで何が起こっているのかを明確に説明する方法を知っている人はいますか? 2 つのリンクは、円グラフの 2 つのスライスだけにどのように関連付けられていますか? リンクをラベルやパイの特定のスライスに一貫して関連付けるにはどうすればよいでしょうか?

ノート

個人的には、パイチャート関数が値、ラベル、リンクの 3 つの「別々の」文字列を取り込んでいて、コードが読みづらくなってしまうのが好きではありません。元は次のように見えます...

例

代わりに、配列の配列を渡すことができる方が良いでしょう...array = [[SliceValue1, label1, link1], [SliceValue2, label2, link2],など。誰かがこれを行う方法を知っている場合は、コードをクリーンアップして読みやすくするための優れた方法です。

ソースコード

http://g.raphaeljs.com/dotchart.htmlのドットチャートのサンプルコードを使用していますが、データを変更するとうまく機能しません。Y値とX値の数は変わる可能性がありますが、使用法も同様です。
適切な数のxs値とys値を生成する外部コードがあります。x / yラベル/データが多い（または少ない）場合は、高さと幅を変更する必要があることがわかりました。x / yラベルのいずれかである場合は、幅も調整する必要があります。

DOTチャートの高さと幅を動的にするにはどうすればよいですか？すべての助けに感謝します。

jquery mobile と graphael を使用して円グラフを描画しようとしていますが、うまくいきません。何が間違っているのかわかりません。誰にも指針がありますか？これは、 http: //www.artetics.com/Articles/using-various-javascript-libraries-to-create-pie-chart から使用した JavaScript です。

ここにhtmlがあります。jsfiddle のリソースとして raphael ライブラリを含めました。

私は、RaphaelSVGライブラリのグラフィック拡張であるgRaphaelを使用したライブ更新線グラフの実装に取り​​組んでいます。

ほぼリアルタイムの更新プロジェクトとしてこれを行っている人の例は見当たらないようですが、これは問題ありません。新しいデータセットを使用してグラフの更新を呼び出す方法があると思いますが（毎回まったく新しいRaphaelオブジェクトを再初期化する必要はありません！）、そこに問題があります。

正確なドキュメントはどこにもありません。私はこのStackOverflowの質問を発見しました：Graphael折れ線グラフは、このドキュメントプロジェクトにつながりました：https ：//github.com/kennyshen/g.raphael/tree/master/docs 、しかし結果は冷たくなりました。提供された例を使用して、私はいくつかのエラーに遭遇しました：

1. 例で使用されている構文r.g.linechart()は無効になりました（ここで、rはRaphaelオブジェクトであり、gは内のgRaphaelプロパティであると想定しています）。途中のどこかで、誰かがRaphaelオブジェクトを適切に拡張して機能するように切り替えたに違いありませんr.linechart()。

2. 渡されたパラメーターlinechart()が正しくないため、再び未定義のエラーが発生しました。パラメータのみを渡し#x, #y, width, height, arrayX, arrayYてチャートラベルなどをドロップすると、無地の線を描くことができます。ただし、もちろん、軸にラベルを付けたり、凡例などを提供したりできる必要があります。

言うまでもなく、APIドキュメントのないライブラリは、だれにもあまり役に立たないでしょうが、コード自体を読むことに厳密に基づいて学ぶことをいとわない頑固者がそこにいます。私はその一人ではありません。よくコメントされた例で、できればライブアップデートを使用して、おそらく大丈夫でしょう。

だから私は質問が次のとおりだと思います：

1. 私がリンクしたものよりも優れたドキュメントを知っている人はいますか？
2. 誰かが私に例を教えてもらえますか、ドキュメントは失敗しますか？
3. linechart()誰かが受け入れるパラメータの適切な項目化を提供できますか？

ありがとう！

記録のために、これが私がこれまでにどれだけ離れているかです：

gRaphaelを使用して折れ線グラフを表示できますが、ツールチップに問題があります。ツールチップは、すべての列ではなく、特定の列に対してのみ表示されます。データが多すぎるのかどうかはわかりませんが、207列はそれほど悪くないはずです。キャンバスのサイズは900x300です。以下はサンプルコードです....どんな助けでも大歓迎です！

ありがとう、

g.Raphael を使用してグラフを作成しました。

後でクリックイベントをpie.sectorに追加しましたが、イベントが機能しません... jQueryでgRaphaelを処理する正しい方法を知っている人はいますか?