3 Replies Latest reply on Mar 26, 2020 4:17 AM by Rutuja Uttarwar

    Can we customize CSS, JS in tableau onilne.

    Rutuja Uttarwar

      I have created one html file to viz one dashboard of tableau online. To auto refresh the data I have used following function .

      setInterval(function () {viz.refreshDataAsync() }, 3000);

      Actually , I am facing  one issue here. While reloading the dashboard  after specific interval,one spinning symbol is coming  (which is disturbing) (to show loading.. function).

      So my question is, Can we customize javascript class  of tableau-2.js file.

      We need to add  style tag as display:none !important after finding div class for spin symbol.

      I am not expert in javascript but i tried to call specific div  class and tried to customize but no output!!!

      Thanks in advance. : )

        • 1. Re: Can we customize CSS, JS in tableau onilne.
          Santiago Sanchez

          Hi Rutuja,

           

          I'm not aware of a way to remove the spinning circle using CSS; however you can use some JavaScript tricks to make it look like it's not there. The idea is to have 2 vizzes in your HTML page, one that's displayed and one that's hidden. While you are displaying one, the other one is being refreshed on the background and therefore the spinning circle isn't displayed. Once it's ready (rather, once timer is up) you can swap the visibility of the sheets.

           

          The HTML attached has a sample of this behavior. Just make sure to allow enough time on the 'Refresh seconds' so that the hidden dashboard has enough time to finish fully rendering:

           

          PercentOfTotal.gif

           

          Hope this helps!

          Santiago

          • 2. Re: Can we customize CSS, JS in tableau onilne.
            Ross Helenius

            We used to inject a custom loading svg in 10.5 into the javascript libraries directly on server (the bootstrap and vizql scripts) because we didn't have front end control. However the code base has changed significantly in the update path to 2019.3 and we haven't updated it to keep doing so. We already had a loading icon that was consistent across the rest of our product and wanted to keep it consistent. The overhead of maintaining the changes post update and changing code base in the server packages made it more of a hassle than benefit.

             

            This should be something exposed in customization options in my opinion.

            • 3. Re: Can we customize CSS, JS in tableau onilne.
              Rutuja Uttarwar

              It would be helpful if you share code with us or you can email me.

              rutujauttarwar1996@gmail.com