Visualize.js render dashboard with different loading mask

[qin.qian]

Hi All,

We're using visuailize.js for integration. We create a dashboard with 4 reports in jasper server. And in our application,we implemented like below:

if (currentDashboard) {

            currentDashboard.params(parameters);

            currentDashboard.run(finishRendering, failInRendering);

        } else {

            currentDashboard = v.dashboard({

                container : main,

                resource : dashboardUri,

                linkOptions : {

                    events : { // link events

                        "click" : hyperlinkClick

                    }

                },

                success : finishRendering,

                error : failInRendering,

                params : parameters

            });

        }

The expected behavior should be dashboard ui firstly render the layout and then asyncronizily call report execution. When report running, each report ui will be overloaded by the grey loading mask. One report, one mask.

The problem is when first loading, the loading mask won't appear for a while, and then shortly flashed one by one. But when changing the parameter and rerun the dashboard, the loading mask appeared at the same time as expected.

 

Could someone give a suggestion?

 

Thanks,

Qin

[joseng62]

Yip I have noticed this as well. Was wondering how to fix this as well. 

[joseng62]

Seems that the grey loading mask is generated by highcharts and not Jasper. 
You can edit the loading text via "highchart api http://api.highcharts.com/highcharts#lang.loading" use this a proprty in you chart. 

We could not figure out how to replace the loading mask. 
Instead we implemented our own loading mask. Our loading masks check for the report execution is done and then the mask is set to hide. Only work around we could figure.