問題タブ [graphael]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
2 に答える
1000 参照

svg - Graphael 円グラフの凡例の重なり

私はここ数週間、gRaphaëlチャートを使用していますが、ときどき奇妙な問題が発生します。繰り返されるテーマは、円グラフの凡例ラベルがすべて間違った場所でつぶれてしまうことです。写真 > 言葉:

ここに画像の説明を入力

この場合、期待どおりにチャートが作成されます。

次に、さらに基本的なスタイリングを行いますが、それをオフにしても役に立ちません。この問題はノードではっきりとわかり<svg>ます (テキスト ノードと円ノードが重なり合う位置を共有しています) が、どこから来たのか、なぜ発生したのかはわかりません。他のチャートは問題なく動作します。フォーラムや問題トラッカーにも何もありませんが、代わりに/同様に質問する必要があることに気付きました。

とを使用Raphaël 2.1.0g.Raphael 0.51ます。

0 投票する
0 に答える
623 参照

javascript - gRaphael 折れ線グラフの列の値を更新する

以下の関数を使用してクリックで更新する gRaphael 折れ線グラフがあります。問題は、列の値を設定しようとしても有効にならないことです。そのようです...

最初のグラフを作成して折れ線グラフを作成し、animateChart関数を使用して折れ線グラフをアニメーション化/更新して新しい値にします。私が直面している問題は、ホバー時にanimateChart関数の実行後に値が変更されないことです。列の値を指定した新しい値に更新する必要があるため、理想的ではありません。

基本的に、折れ線グラフをアニメーション化/更新するときに列の値を更新するにはどうすればよいですか?

私はちょっとロープの終わりにいます...ありがとう。

0 投票する
1 に答える
491 参照

javascript - gRaphael linechart hoverColumn関数で現在のX値を取得するにはどうすればよいですか?

以下に、タグ hovereffects を使用して単純な gRaphael 折れ線グラフを作成するためのコードとコメントをいくつか投稿しました (含まれているスクリプト ファイルはhttp://raphaeljs.comおよびhttp://g.raphaeljs.comにあります)。コードは正常に機能します (したがって、gRaphael ラインチャートを使い始める他のユーザーにとっては良い例になる可能性があります) が、タグ関数のテキスト引数に関して質問/要求があります。

そのままでは、タグは現在の列の各ポイント (this.values[i]) の Y 値を表示しますが、X 値と Y 値の両方を表示したいと思います (X, Y)。とても簡単だと思いますが、これまでのところ、その方法を理解できていません。カンマとスペースを追加しても問題ありませ', ' + this.values[i]んが、X の値に対処する方法がわかりません。this.attr("x")は、これまでで最も近いものですが、それは紙の X 座標であり、チャートの X 軸の X 値ではありません ;-)

誰でも私を助けてもらえますか?


0 投票する
0 に答える
280 参照

raphael - ライン ラベル 円グラフ グラファエル

モバイル デバイス用の html5 Web を作成しており、graphael を使用して円グラフを作成しています。グラフは完全にレンダリングされますが、解決策が見つからないという 2 つの問題があります。

チャートの最初の部分を 12 時に開始してほしい。

https://dl.dropbox.com/u/23287638/piechart.png

そして、私の 2 番目の問題は、次のようにチャートの各部分に線ラベルを付けたいということです。

https://dl.dropbox.com/u/23287638/chart2.png

この2つのことを行う方法について何か提案はありますか?

ありがとう

0 投票する
2 に答える
519 参照

raphael - Rally sdk 2.0でカスタムHTMLを追加するにはどうすればよいですか?

Rally SDK 2.0を使用して、いくつかのカスタムゲージを使用してアプリを作成しています。これには、カスタムHTMLが必要です。出発点として、例からrakeでコンパイルされたapp.htmlファイルを取得しました。ゲージにJustGageを使用しています。これが私の起動機能です。

次に、app.htmlにカスタムHTMLを追加しました。

ここに画像の説明を入力してください

これをコード「this.add('foo')」なしで実行すると、アプリはclass = "x-container"を使用して本文に新しいdivを追加し、カスタムHTMLをそのdivの外に効果的に隠します。

「this.add('foo')」を使用すると、div class = x-containerが作成されず、ウィジェットが正常に表示されます。

2.0 SDKを使用して試みていることを達成するための適切な方法は何ですか?addメソッドはExtコンポーネントを追加するためのものであることに気付きましたが、どういうわけかこれを呼び出すとHTMLが正常にレンダリングされます。古いSDKで開発したいくつかのアプリを見ると、カスタムHTMLを使用しても問題なく機能しました。

0 投票する
1 に答える
467 参照

javascript - 組み込みの 2 次元配列を使用した Raphael.js 棒グラフ プロットが失敗する

実際の値を渡すのではなく、プログラム内で作成した 2 次元配列 (これが必要です) を使用して棒グラフ (Raphael.js) を描画しようとしていますが、空白の画面が表示されません。配列の解析に問題がある g.bar.js と、私が持っている g.bar.js は g.raphael.com からのものだと推測しています。https://github.com/vezult/g.raphael/blob/8a2b7dc3f97dedf5196791fa9eaa8640350d161a/g.bar.jsから g.bar.js も試しましたが、このことをコンパイルすることさえできません。Barchart call r.barchart(5, 10, 300, 220, data, {stacked: true, type: "round"}).hoverColumn(fin2, fout2); データは二次元配列 経験者の方はご連絡ください。ありがとう。

0 投票する
1 に答える
1620 参照

sorting - g.Raphael piechartは、色やURLではなく、グラフデータを並べ替えます

検討:

これにより、上のスライスが赤、右下のスライスが緑、最後のスライスが青の円グラフが作成されます。ただし、値が次のように変更された場合:

グラフはまったく同じように見えますが、色は適切な値を表していないことになります。ソースコードの99〜101行目は、並べ替えられている値を示していますが、それ以外は何も示していません。

オプションにリストされている最初の色を取得する最大の変数ではなく、色がどれほど大きくても、特定の変数に対応する色が必要です。

スライスを描画するコードの部分(133行目)では、を参照してopts.matchColorsいますが、関数を呼び出すときにそれを設定する方法についてのドキュメントが見つかりません。

これを達成する方法はありますか?

0 投票する
2 に答える
1662 参照

javascript - g.raphaeljs 円グラフの方向または開始点を設定するにはどうすればよいですか?

デフォルトでは、g.raphaeljs の円グラフは、グラフの上部から両方向に均等に伸びる最大値を示し、小さい値は時計回りに表示されます。

下の画像では、最大値 (1) は約 7 時から始まります。代わりに 12 時からの最大値を表示したいのですが、どうすればよいですか?

デフォルトの動作 対象行動

0 投票する
2 に答える
1126 参照

javascript - 半円を考慮したマウス位置でパーセンテージを計算する

パーセンテージを計算するために justGage (Raphael JS コードを使用) でいくつかのトリックをコーディングしようとしましたが、数式 :( .

ポイントは次のとおりです。svg justGage を歓迎する幅 400px の div があります。マウスクリックに続いて塗りつぶしたいと思います。たとえば、半円の右下をクリックすると、100% 塗りつぶされたかのように塗りつぶされます。左下をクリックして、0%で塗りつぶします。問題は、マウスの位置をキャッチし、それを使用してゲージを更新しようとすることですが、X 軸のみで作業すると円の形状に従っていません。

これが私の基本的な計算です:

そして、コード全体のテストfiddle .

円の形を実際にたどる公式を知っている人はいますか?

0 投票する
1 に答える
192 参照

javascript - 図をvarの値に置き換えます

関数があり、それにいくつかのオプションを設定する必要があります。

別の関数から、好きなもののカウンターを取得します。

いいえ、最大値を交換したいです。値、200からvarlikesの値。

私の解決策value : (0, {likes}),は機能しません。

なにが問題ですか?どうもありがとうございます!