0

これをGoogle ビジュアライゼーション グループに投稿したところですが、Plone コミュニティにも助けを求めようと思いました。

私は Plone 4.2.4 を使用しており、cx_Oracle を介して Google チャートを Oracle バックエンドと統合したいと考えていました。EEA.Davizという非常に優れたパッケージが既にあります。しかし、それは私が必要とする以上のものであり、自分でできると思ったので、いくつかのページ テンプレートと Javascript をラップする Python コードを作成しました。私のラップトップ(Mac OS X)では、すべて正常に機能しました。

ただし、サーバー (SLES 10) にプッシュすると、BarCharts が機能しなくなりました。棒グラフ、折れ線グラフ、およびモーション チャートのみをテストしました。「e[0].K is undefined」という赤いエラー ボックスが表示されるだけです。グーグルで調べたところ、Google ビジュアライゼーションのエラーであり、幅と高さのプロパティを変更することで修正できるという非常によく似た問題の説明が見つかりました。ただし、高さまたは幅を変更しても修正されませんでした。非常に奇妙なのは、サンプル JS を BarChart ページからコピーしてバニラ Zope ページ テンプレートにコピーすると、問題なく動作することです。ただし、マスター テンプレートでラップすると、赤いエラー メッセージが再び表示されます。

だから私は混乱しています。ラップトップに同じテーマをインストールしましたが、問題はありませんでした。バニラ ページ テンプレートのテーマなしでサーバーに BarCharts を表示できることはわかっています。

誰かが私を正しい方向に向けることができますか?

機能する ZPT:

<html>
<head>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script>
google.load("visualization", "1", {packages:["corechart"]});
                                google.setOnLoadCallback(drawChart);
                                function drawChart() {
var data = google.visualization.arrayToDataTable([
['COUNTRY', ' COUNT'],
['Austria', 19],
['Belgium', 73],
['Bulgaria', 20]]
                  ); var options = {
                     title: 'Test Bar Chart'}; var chart = new  google.visualization.BarChart(document.getElementById('chart_div'));
                  chart.draw(data, options);}
</script>
</head>

  <body>
    <div id="chart_div" style="width: 900px; height: 1000px;"></div>
</body>
</html>

機能しない ZPT:

    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"
          xmlns:tal="http://xml.zope.org/namespaces/tal"
          xmlns:metal="http://xml.zope.org/namespaces/metal"
          xmlns:i18n="http://xml.zope.org/namespaces/i18n"
          lang="en"
          metal:use-macro="context/main_template/macros/master"
          i18n:domain="plone">

    <metal:main fill-slot="javascript_head_slot">
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script>
    google.load("visualization", "1", {packages:["corechart"]});
                                    google.setOnLoadCallback(drawChart);
                                    function drawChart() {
    var data = google.visualization.arrayToDataTable([
    ['COUNTRY', ' COUNT'],
    ['Austria', 19],
    ['Belgium', 73],
    ['Bulgaria', 20]]
                      ); var options = {
                         title: 'Test Bar Chart'}; var chart = new google.visualization.BarChart(document.getElementById('chart_div'));
                      chart.draw(data, options);}
    </script>
    </metal:main>

  <body>
<metal:main fill-slot="main">
<tal:main-macro metal:define-macro="main">

    <div id="chart_div" style="width: 900px; height: 1000px;"></div>

</tal:main-macro>
</metal:main>   
</body>
</html>
4

1 に答える 1

0

2番目の例をテストしましたが、意図したとおりに機能しているように見えるので、Oracleからのデータに問題がある可能性があります(形式、欠損値など)。JS のデバッグを行う必要があります。ブレークポイントを追加して、e[0]が何であるか、およびK属性がない理由 (またはeが空の配列である理由) を確認してください。

また、EEA Davizは、複数の視覚化フレームワーク ( Google ChartsSimile Exhibit、および近い将来にHighcharts ) をまとめたバンドルですが、平面全体を持ち込むことなく、そのコンポーネントの 1 つまたは複数をいつでも使用できます。したがって、 EEAも試してみてください。Google チャート. Plone 4.2.x では、collective.js.jqueryui < 1.9が必要になることを忘れないでください。

Ploneでのテスト

于 2013-04-18T08:15:11.943 に答える