Rails の初心者として、私は Rails で動作する優れたオープン チャート ライブラリを見つけようとしています。
いくつかの調査で、gRaphael を見つけました。Rails アプリで使用できれば、うまくいくようです。グラファエル (graphael-rails) を集約しているように見える宝石を見つけましたが、実際にはそうではありません。ファイルを参照できず、ローカルの資産ディレクトリにコピー/貼り付けする必要があるため、使用方法を理解しています。
私はガイドラインに従い、raphael-min.js、g.raphael.js、および g.pie.js を assets/javascripts フォルダー内に配置し、demo.css ファイルを stylesheets フォルダーに配置し、いくつかの背景画像を配置しました。 .
application.html.erb に追加しました
<%= javascript_include_tag "raphael-min.js","g.raphael.js","g.pie.js", "application" %>
そして私の見解に：
...
<div id="holder"></div>
...
<%= javascript_tag "
var r = Raphael(""holder"");
r.piechart(320, 240, 150, [55, 20, 13, 32, 5, 1, 2, 10]);
r.text(320, 70, 'Static Pie Chart').attr({ font: '20px ""Fontin Sans"", Fontin-Sans, sans-serif' });
" %>
</body>
問題は、何らかの理由で円グラフ関数が Raphael DOM オブジェクトに組み込まれていないことです....
私は何を間違っているのでしょうか？私はこれに関する答えを探すのに丸一日を費やしました。ここで何か助けていただければ幸いです。
これが私のhtmlファイルにロードされているスクリプトです
<script type="text/javascript" src="/assets/raphael-min.js?body=1">
<script type="text/javascript" src="/assets/g.raphael.js?body=1">
<script type="text/javascript" src="/assets/g.pie.js?body=1">
<script type="text/javascript" src="/assets/jquery.js?body=1">
<script type="text/javascript" src="/assets/jquery_ujs.js?body=1">
<script type="text/javascript" src="/assets/bootstrap-transition.js?body=1">
<script type="text/javascript" src="/assets/bootstrap-alert.js?body=1">
<script type="text/javascript" src="/assets/bootstrap-button.js?body=1">
<script type="text/javascript" src="/assets/bootstrap-carousel.js?body=1">
<script type="text/javascript" src="/assets/bootstrap-collapse.js?body=1">
<script type="text/javascript" src="/assets/bootstrap-dropdown.js?body=1">
<script type="text/javascript" src="/assets/bootstrap-modal.js?body=1">
<script type="text/javascript" src="/assets/bootstrap-scrollspy.js?body=1">
<script type="text/javascript" src="/assets/bootstrap-tab.js?body=1">
<script type="text/javascript" src="/assets/bootstrap-tooltip.js?body=1">
<script type="text/javascript" src="/assets/bootstrap-popover.js?body=1">
<script type="text/javascript" src="/assets/bootstrap-typeahead.js?body=1">
<script type="text/javascript" src="/assets/bootstrap.js?body=1">
<script type="text/javascript" src="/assets/g.pie.js?body=1">
<script type="text/javascript" src="/assets/g.raphael.js?body=1">
<script type="text/javascript" src="/assets/jquery-ui.min.js?body=1">
<script type="text/javascript" src="/assets/raphael-min.js?body=1">
<script type="text/javascript" src="/assets/retailers.js?body=1">
<script type="text/javascript" src="/assets/application.js?body=1">
そして私のapplication.jsファイルの内容：
//= require jquery
//= require jquery_ujs
//= require bootstrap
//= require_tree .
raphael の js ファイルが 2 回読み込まれていることに注意してください。application.html.erb ファイルにそれらを含める唯一の理由は、そうしないと、g.raphael.js と g の後に raphael-min.js が読み込まれるからです。それに依存するpie.js、そしてjavascriptエラーが発生します...
これに関する提案はありますか？
ありがとう