私はjavascriptチャート作成スクリプトに苦労しています。スクリプトを呼び出すには、head に次のコードを配置する必要があります。
<script type="text/javascript">
$(function(){
$('table').visualize({type: 'line'});
});
</script>
このスクリプトは、データのテーブルをスクレイピングし、きれいなグラフを生成します。すべて正常に動作します。問題ありません。問題は、それを完全な Web サイトに移行するときです。私は明らかにページに多数のテーブルを持っており、このスクリプトはそれぞれをスクレイピングし、直後にチャートを配置しようとします。これに対抗するために、「charttable」のターゲット テーブルにクラスを追加し、上記のコードを次のように変更しました。
<script type="text/javascript">
$(function(){
$('.charttable').visualize({type: 'line'});
});
</script>
これで、期待どおりにチャートがスクレイピングされて生成されるようになりました。私が今持っている問題は、それが呼び出すjavascriptがさまざまなクラスを使用してグラフを描画およびスタイルしようとすることです。これらは無視されているように見えます.お互いなどのjavascriptの例は以下のとおりです
//function to create a chart
var createChart = {
pie: function(){
canvasContain.addClass('visualize-pie');
if(o.pieLabelPos == 'outside'){ canvasContain.addClass('visualize-pie-outside'); }
var centerx = Math.round(canvas.width()/2);
var centery = Math.round(canvas.height()/2);
var radius = centery - o.pieMargin;
var counter = 0.0;
var toRad = function(integer){ return (Math.PI/180)*integer; };
var labels = $('<ul class="visualize-labels"></ul>')
.insertAfter(canvas);
これらのクラスはそれぞれ、次のような 2 つのスタイル シートによってスタイル設定されます。
.visualize { margin: 60px 0 0 30px; padding: 70px 40px 90px; background: #222 url(../images/chartbg.png) top repeat-x; border: 1px solid #000; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; }
.visualize canvas { border: 1px solid #888; margin: -1px; background: #222; }
.visualize-labels-x, .visualize-labels-y { top: 70px; left: 40px; z-index: 100; }
クラスとサブクラスをターゲットにできると考えて、スタイルシートのすべてのエントリの前に .charttable を追加しようとしましたが、うまくいきませんでした。
スクリプトは、テーブルから削り取られた見出しとラベルを使用してグラフを描画するため、少なくとも部分的に正しく機能しているに違いないことはわかっています。線を描画したり、ラベルを正しく配置したり、スタイルを守ったりしません。
コンテナだけでなく、「charttable」のクラスを追加してターゲットにするように書いたのでしょうか? いいえの場合 - コンテナをターゲットにする方法に関して別の回避策はありますか? はいの場合 - スタイルシートが無視されるようになったのはなぜですか?
上記が意味をなさない場合は、私はまだJavaを学んでいるので、深くお詫び申し上げます...