Visualize: complex sample 4 reports

by NesterOne

HTML

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.0/jquery-ui.min.js"></script>
<script type='text/javascript' src="http://visualizejs-preview.eng.jaspersoft.com:8080/jasperserver-pro-branch/client/visualize.js"></script>
<table class="sample">
    <tr>
        <td id="c1"></td>
        <td id="c2"></td>
    </tr>
    <tr>
        <td id="c3"></td>
        <td id="c4"></td>
    </tr>
</table>

CSS

html, body {
}
table.sample {
    width: 100%;
}
td#c1, td#c2, td#c3, td#c4 {
    width: 50%;
}

JavaScript

visualize({
    auth: {
        name: "superuser",
        password: "superuser"
    }
}, function (v) {

    var reportsToLoad = [
        "/public/Samples/Reports/AllAccounts",
        "/public/Samples/Reports/01._Geographic_Results_by_Segment_Report",
        "/public/Samples/Reports/Cascading_Report_2_Updated",
        "/public/Samples/Reports/07g.RevenueDetailReport"
    ];
    
    var success = function (data) {
         console.log(data);
         console.log(this);
     };
    
    var error = function (err) {
         alert(err.message);
         console.log(this);
    };
    
    $.each(reportsToLoad, function (index, uri) {
        var container = "#c" + (index + 1);
        var report = v.report({
            resource: uri,
            container: container,
            success: function(){
                success.apply(report, arguments);
            },
            error: function(){
                error.apply(report, arguments);
            }
        });
    });
  
    
});