問題タブ [chartkick]
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.
ruby-on-rails - Rails Active Admin + Chartkick = 機能しない?
Chartkick を使用して、レールのアクティブな管理ダッシュボードに表示されるグラフを生成しようとしていました。私が使用しているチュートリアルは次のとおりです。 http://www.patrickedelman.com/simple-charting-for-activeadmin/
ただし、グラフは表示されず、代わりに「読み込み中...」と表示されます
すでに javascript_include_tag "//www.google.com/jsapi", "chartkick" をインクルードしており、gem chartkick がインストールされていますが、それでも機能しません。
助けてください!ありがとうございました。
ruby-on-rails - Chartkickで列をグループ化するにはどうすればよいですか
次のデータ構造があります。
年ごとにグループ化されたChartkickを使用して縦棒グラフを表示したいと考えています。Rails ビューで次のプラン呼び出しを試しました。
しかし、空のチャートが表示されます。データのセットをグループ化する方法は何ですか?
これは、Plan Google Chart APIsを使用して取得したものです。
mysql - 明示的なグループと「groupdate」gem を使用した hasing 句
groupdate
日付/時刻でレコードをグループ化するために gem を使用しています。レコードをグループ化し、having 句でユーザーを選択してから、日付/月/時刻でレコードをグループ化します。しかし、私が望む適切な結果が得られません。例えば:
chartkick
これは、 gemを使用してチャートを表示するために使用しています。
どんな助けでも大歓迎です。
ruby-on-rails - Chartkick Gem にハイチャートを追加する
chartkick gem が既にインストールされている Rails 4 プロジェクトに Highcharts を追加しようとしています。
Google チャート ライブラリを使用すると、すべてのチャートが期待どおりに機能するように見えます。代わりに Highcharts を追加すると、グラフが表示されません。
次のことを確認しました: 1) '= javascript_include_tag "components/highcharts.js", "chartkick" ' をレイアウト フッターに追加すると、Rails から、このアセットを初期化子として追加するように求められます。2) これをイニシャライザに追加すると、ページをロードできますが、チャートはロードされません。Firebug を見ると、Highcharts が 2 回読み込まれたというエラーが表示されます。
また、Application.js に Highcharts JS を追加しようとしましたが、うまくいきませんでした (ページは読み込まれますが、グラフは表示されません)。
何か案は?
ruby-on-rails - 累積チャートキック チャート & Acts_As_Taggable_On
現在、Chartkick とacts_as_tggable_on を使用して Rails アプリで使用される一部のデータの現在の合計を取得する際に問題が発生しています。
ユーザーにタグ付きのアイテムを検索してもらいたいのですが、私の @items は次のとおりです。
x 軸はアイテムの created_at 日付で、y 軸はモデルからの単なる :result であり、整数です。x 軸の各項目を、最後の値 (正または負の数値) を含む累計にします。
私が設定した場合:
これをチャートキックに使用します:
チャートはうまく機能しますが、検索パラメーターでチャート化されているものを明らかにフィルタリングしていません。
検索パラメーターを介してフィルター処理する折れ線グラフの @chart を @items に変更するとすぐに、エラーが発生します。
モデルにさまざまなスコープを作成して状況を改善しようとしましたが、これまでのところ役に立たないようです。
助けていただければ幸いです。
javascript - Chartkick google geo-chart - ツールチップ値として文字列を使用することは可能ですか?
Chartkick を使用して、Google API を使用してこのマップを表示しています。
現在、2番目の値として文字列を渡すと、機能しません。しかし、整数はそうします。
これを実現するレールからの方法はありますか?Google ドキュメントと chartkick を確認しましたが、どこにも言及されていません。
ありがとう!
参照用: https://developers.google.com/chart/interactive/docs/gallery/geochart#important
ruby-on-rails - ハッシュを通過するChartKick gem
私はChartKick ruby gemを使用していますが、パラメーターを渡してパーセンテージのフォント サイズを変更し、2 番目のパーセンテージのテキストを非表示にする方法を考えています。
私はこれを参照していて、実行することで両方のパーセンテージを非表示にすることpieSliceText: 'none'
ができましたが、それを2番目のパーセンテージにのみ適用する方法がわかりませんでした. fontSize パラメータもフォントのサイズを変更していません。助言がありますか?
右側の青色のパーセンテージ テキストを大きくし、左側のパーセンテージ テキストを非表示にします。
ruby-on-rails - Rails Chartkick が折れ線グラフのポイントを結合しない
現在、Rails で chartkick を使用してデータを表示しようとしています。各ポイントに同じ x データ (klass_result_set の作成日) が含まれているチャートに、既に 4 セットのデータがあります。
グリッドに表示するタスクのリストを追加したいと考えており、グラフの下部にあるポイントで落ち着くことができましたが、これらのタスクを追加しようとすると、データポイントの結合が停止します。
これを正しく機能させる方法はありますか?両方のセットの日付を連結し、null/nil 値を使用する必要がありますか?
画像
http://s9.postimg.org/l4pu1pl67/chartkick_issue.png
コード スニペット:
...
乾杯
javascript - javascript で要素を切り替えると、ブラウザのサイズを変更するまで要素が小さすぎるように見えます
編集
最初にこの質問を投稿して以来、問題を解決するためにさらにいくつかの道をたどりました。まだ解決されていませんが、私の質問は異なります。元の質問は以下にあり、その下にセクションを追加して更新します。
元の質問
私は Rails 4 アプリケーションに取り組んでおり、JavaScript と Chartkick gem に問題があります。
ユーザーがアイコンをクリックすると、要素がアイコンの下にドロップダウン/ページに表示され、アイコンが右向き矢印から下向き矢印に切り替わるようにする 2 つの JavaScript 関数があります。コードは次のとおりです。
そしてハムル:
できます。ただし、次のように、ドロップダウンするアイテムがページの全幅を占めることを期待しています。
しかし、トグル アイコンを最初にクリックすると、次のように押しつぶされて表示されます。
次に、ブラウザのサイズを少し変更すると、グラフが全幅に飛び出し、そこから何をしてもそのままになります。このチャートは Chartkick から gem として提供されているため、生成されたマークアップを取得する方法がわかりません。ブラウザで生成された html には次の行があります。
ブラウザのサイズを変更したときに変更width: 300px
されるのはどこですか。width: 1000px
ブラウザのサイズを永続的または大幅に変更する必要はありません。最初にその幅が 1000px に変更されると、ページを更新してアイコンをクリックしてグラフを再度切り替えると、300px に戻ります。この div にフックする方法がわかりません。この div は gem によって生成されたものであり、それにクラスを追加する方法がわからないからです。親要素のすべての子が であることを保証する親要素にスタイリングを追加しようとしましたがwidth: 100%
、それは何もしません。
とにかく、クラスを追加することがここでの解決策だとは思いません。私はJavaScriptが信じられないほど上手ではありません. 私は、すべてのフロントエンド作業全体にまったく慣れていません。ここで何が起こっているのですか? また、これらのチャートを切り替えたときに常にページの全幅になるようにするにはどうすればよいですか?
注: Chrome でこれをテストしています。Firefoxでテストしましたが、同じことを行います。
OK、これは動的なアイテム ID を取得するために JavaScript 関数を使用しているという事実と関係があるのではないかと考え始めています。 IDが何であるかがわからないため、各IDに対するjQuery関数は不可能に思えます。
ただし、jQuery 呼び出しを削除しましたが、問題は解決しません。
スタック オーバーフローの質問ボックスをラバーダッキングしても、まだ私の質問に答えられていないときの 1 つです。だから私は提出し、ここで外部の助けを期待すると思います. :/
調整された質問
Chartkick の Github の問題にあるこの質問は、私を別の道に導きました。解決策は、必ずしもグラフのスタイルを変更しようとすることではありません。代わりに、ブラウザー ウィンドウのサイズが変更されるとグラフが自動的に再生成されるため、サイズ変更イベントをトリガーしようとしています。これが問題の原因であり、解決策がどこにあると思われるかの両方です。
私のコード:
したがって、ここでの意図は、 をクリックすると、グラフが表示された が.panel-heading
ドロップダウンされ.panel-body
、ウィンドウのサイズが変更されることです。
トリガーを最初にクリックすると.panel-heading
、グラフのサイズが変更されませんが、もう一度クリックすると、グラフが一瞬完全にサイズ変更されます...再びビューから非表示になる直前に。:(
次のように、javascript にタイムアウトを追加しようとしました。
しかし、それはまったく何もしていないようです。
ここで私が疑問に思っているのはresize
、ドロップダウンが出たらこのイベントを機能.panel-body
させて、グラフが独自に適切にサイズ変更されるようにする方法です。
十分に明確に説明していない場合に備えて、現在の問題のスクリーン キャストを次に示します。