2016-04-28 14 views
0

私のレポートを表示するにはDIVを使用したいので、icCubeのドキュメントicCube Web Reporting : Displaying a Reportを参照してください。しかし、私はそれを適用しようとすると、どのように同じHTMLページに収集するスクリプトのdifferents関数を置くことができますか、私は私が収集するために、これらの部品を入れてことができる方法inderstandません同じHTMLページにスクリプトのdifferents関数を組み込むにはどうすればいいですか?

最初のパート

var ic3reporting = new ic3.Reporting({ 
    noticesLevel: ic3.NoticeLevel.ERROR, 
    dsSettings: { 
     userName: "demo", 
     userPassword: "demo", 
     url: "http://localhost:8282/icCube/gvi" 
    } 
}); 

ic3reporting.setupGVIConfiguration(function() { 
    ic3reporting.setupApplication({ 
     mode: ic3.MainReportMode.REPORTING, 
     menu: ic3.MainReportMenuMode.OFF, 
     noticesLevel: ic3.NoticeLevel.ERROR, 
     container: $("#report-container") 
    }); 

}); 

セカンドパート

var options = { 
    report: { name: 'My Report' }, 
    mode: ic3.MainReportMode.EDITING_REPORTING, 
    menu: ic3.MainReportMenuMode.ON, 
    noticesLevel: ic3.NoticeLevel.INFO 
}; 

ic3reporting.openReport(options, function() { 
    // your callback (I don't inderstand how can i putting this code) 
}); 

:それらが機能しています10このスクリプトを作成することは非常に重要です。これにより、以前よりもレポートのエクスポートが容易になります。

答えて

1

あなたは、このような方法で、一緒にこれらの部品を使用することができます。

<!doctype html> 
<head lang="en"> 
    <meta charset="utf-8"> 
    <style> 
     html, body { 
      margin: 0; 
      padding: 0; 
      width: 100%; 
      height: 100% 
     } 
    </style> 
</head> 
<body> 
<!-- 1. Define container for the report somewhere in html page --> 
<div id="report-container"></div> 

<!-- 2. Include reporting application scripts --> 
<script src="http://localhost:8282/icCube/doc/ic3-report/app/reporting/js/loader/ic3bootstrap.js"></script> 

<!-- 3. Initialization sequence --> 
<script type="text/javascript"> 
    var ic3root = "http://localhost:8282/icCube/doc/ic3-report/app/"; 
    var ic3rootLocal = "http://localhost:8282/icCube/doc/ic3-report/app-local/"; 
    // ic3reporting variable could be used globally, consider using array or different names here if 
    // you are going to show multiple report applications at the same time 
    var ic3reporting = null; 

    var options = { 
     root: ic3root, 
     rootLocal: ic3rootLocal, 

     // This function starts work just after initialization of reporting framework 
     callback: function() { 
      // 3.1 Create reporting instance with proper data source configuration 
      ic3reporting = new ic3.Reporting({ 
       noticesLevel: ic3.NoticeLevel.ERROR, 
       dsSettings: { 
        userName: "demo", 
        userPassword: "demo", 
        url: "http://localhost:8282/icCube/gvi" 
       } 
      }); 
      // 3.2 This function setups connection to the configured datasource and calls callback when connection is ready 
      ic3reporting.setupGVIConfiguration(function() { 
       // 3.3 Here we have ready connection, time to show empty reporting application 
       var initialApplicationOptions = { 
        mode: ic3.MainReportMode.REPORTING, 
        menu: ic3.MainReportMenuMode.OFF, 

        noticesLevel: ic3.NoticeLevel.ERROR, 

        container: $("#report-container") 
       }; 
       ic3reporting.setupApplication(initialApplicationOptions); 

       // 3.4 just after setupApplication we have ready to work reporting environment, we can open reports, switch modes, etc 
       // here we have open report sequence 
       var options = {report: {name: 'My Report'}}; 
       ic3reporting.openReport(options, function() { 
        alert("Report opened successfully") 
       }); 
      }); 
     } 
    }; 
    ic3ready(options); 
</script> 
</body> 
</html> 
0

これはcorrecteコード

<html> 
<head lang="en"> 
    <style> 
     html, body { 
      margin: 0; 
      padding: 0; 
      width: 100%; 
      height: 100%; 
     } 
    </style> 

</head> 
<body> 

<!-- ic3 bootstrap javascript --> 
<script src="http://localhost:8282/icCube/doc/ic3-report/app/reporting /js/loader/ic3bootstrap.js"></script> 

<script type="text/javascript"> 

    /** 
    * Location of the icCube reporting files; not necessarily co-located 
    * with this HTML page. For example, assuming this file is located within 
    * the "Docs" repository of a local icCube install, this path would be : 
    * 
    *   /icCube/doc/ic3-report/app/reporting/ 
    */ 



    var ic3root = "http://localhost:8282/icCube/doc/ic3-report/app/"; 
    var ic3rootLocal = "http://localhost:8282/icCube/doc/ic3-report/app-local/"; 

    var options = { 

     root: ic3root, 
     rootLocal: ic3rootLocal, 

     callback: function() { 
      var ic3reporting = new ic3.Reporting(
      { 
       noticesLevel:ic3.NoticeLevel.ERROR, 

      dsSettings:{ 
      userName:"demo", 
      userPassword:"demo", 
      url: "http://localhost:8282/icCube/gvi" 
      } 
      }); 

      ic3reporting.setupGVIConfiguration(function() { 

      ic3reporting.setupApplication(
      { 

      mode:ic3.MainReportMode.REPORTING, 
      menu:ic3.MainReportMenuMode.OFF, 

      noticesLevel:ic3.NoticeLevel.ERROR, 

      container:$(".ic3-report-content-container") 
      }); 

      var options = { 

      report:{ 
       name:'rapportest' 
       }, 

       mode:ic3.MainReportMode.EDITING_REPORTING, 
       menu:ic3.MainReportMenuMode.OFF, 

       noticesLevel:ic3.NoticeLevel.INFO 

       }; 

       ic3reporting.openReport(options, function() { 
       alert("Report opened successfully") 
       }); 
      });   
     } 
    }; 
    ic3ready(options); 


</script> 
<div class="ic3-report-content-container" style="border:solid 1px red;"></div> 

+0

では、あなたの代わりにマイレポート」の報告書の正しい名前を設定しています"=>' var options = {report:{name: 'My Report'}}; '? 'alert(" Report opened successfully ")'行と必要なコールバックを入れ替えてください。 –

+0

私は他の必要がある、私はこの図をExcelにエクスポートしたいこのdivを使用して私はすでに働いている、これは私の最終目標はエクセルまたは画像にエクスポートすることですが、その解決策を見つける –

+0

レポートについて話している場合は、pdfにエクスポートしてExcelファイルに含めることができます。一方、いくつかのチャートウィジェットを意味するならば、独自のイメージエクスポート機能を使用してください。 質問を明記してください。 –

関連する問題