13 Replies Latest reply on Mar 22, 2018 1:41 PM by Corey Turner

    Printing a public dashboard results in corrupted output

    Colin Young

      I'm playing around a bit with Tableau Public (we're looking at adopting the full solution, but I'm impatient and wanted to get my hands dirty). One of our eventual requirements is being able to embed visualizations into our website, where, I assume, people may want to print them. I'm working under the assumption that the web rendering engine for all versions are the same, so that the display behavior I see from the public product will be the same as the full version. I'm a little concerned because just trying to print the default results in corrupted output. Things like the graph being printed under the axes, the title of graph 1 is overlaid on the title for graph 2, graph 3 is partially on top of graph 2, etc. Both Chrome and Internet Explorer use 5 pages to print it, and both exhibit the same issues, leading me to the conclusion that it's bad HTML causing the problem. I'm a little surprised given the attention to detail elsewhere in Tableau.


      Is there some formatting I need to set up in order to get printing to work correctly? I didn't originally build this sample with the intention of printing it, but nonetheless I would expect printing to "just work" for the default situation.


      Here is the sample I'm working with:


        • 1. Re: Printing a public dashboard results in corrupted output
          Dustin Smith

          Hi Colin,


          I just printed out the pdf version of the Public viz you linked to and it came out fine.  Did you use the default print buttons at the bottom of the visualization or another method?  Possible something is off with your printer settings?


          5-2-2013 3-48-37 PM.png

          • 2. Re: Printing a public dashboard results in corrupted output
            Colin Young

            Thanks for taking a look.

            I do not see a print button:


            I just used the native browser print function (ctrl-P). Both Chrome and Internet Explorer on Windows 7. I get the same results for all printers (including the Chrome PDF target) so I doubt that it is a printer setting issue.

            These stylesheet inclusions make me wonder if Tableau is specifically disabling the ability to print the web page directly:

            <link href="http://publicstaticcdn.tableausoftware.com/vizql/v_80001304241138/javascripts/dijit/themes/tundra/tundra.css" media="screen" rel="Stylesheet" type="text/css">
            <link href="http://publicstaticcdn.tableausoftware.com/vizql/v_80001304241138/javascripts/tableau/web/css/tableau.css" media="screen" rel="Stylesheet" type="text/css">
            <link href="http://publicstaticcdn.tableausoftware.com/vizql/v_80001304241138/css/vqlweb.css" media="screen" rel="Stylesheet" type="text/css">

            Needing to use a PDF to print would be less than ideal.

            Attempting to print the javascript API example from http://www.tableausoftware.com/new-features/javascript-api also results in corrupted output. That example is actually a reasonable example of what we would ultimately like to do, which is to embed visualizations withing a larger context. Being able to simply print the page is going to be an expectation by the end user.

            • 3. Re: Printing a public dashboard results in corrupted output
              Dustin Smith

              Hi Colin,


              Thanks for the feedback. Just did the control+p operation on my own web-browser and wow, that's ugly.


              I misspoke about the print button, I meant export which I don't see on your viz either. Please see this viz which should have a little right facing arrow at the bottom which when clicked, gives you the option to export an image, a pdf, the full dataset, or just a cross tab.  Is getting the PDF/Image then printing it a viable alternative?




              • 4. Re: Printing a public dashboard results in corrupted output
                Colin Young

                The missing export was due to unchecking the footer option. It is here now:




                Exporting to PDF is certainly something that can work, but is less than ideal. As I said before we're looking for a visualization solution that will enable us to embed them in a web page, possibly with text or other graphics.


                It looks as if the browser print functionality has been deliberately broken (see the stylesheet links I posted previously that clearly show the stylesheets only being used for the screen, meaning print output gets no styling). It is certainly possible to print elaborate graphics from the browser without any special effort beyond what is required to get them to display on the screen. See any of the many example from d3.js at https://github.com/mbostock/d3/wiki/Gallery, I've tested a fairly large sampling and found them to print exactly as they appear on screen.


                I'd be curious to find out why browser printing has been disabled. Can you ask the developers why this is the case?

                • 5. Re: Printing a public dashboard results in corrupted output
                  Dustin Smith

                  Hi Colin,


                  Doesn't strike me as something we would be disabling unless there was an exceedingly good technical reason related to render performance, etc. We're more of an enable kinda of folk.


                  Let me ask around and see if I can find an answer.



                  • 6. Re: Printing a public dashboard results in corrupted output
                    Colin Young

                    Thanks. It does strike me as a bit odd. It isn't just my viz. See also these examples, randomly selected:






                    Disable might be too strong of a word. Failed to enable maybe? I know there are a lot of subtleties in translating the interactive screen to print. e.g. you can't scroll paper, so how do you handle overflow? Hide it? Expand to show it all? You'd need a new stylesheet to handle that, although it seems like you've managed to solve the problem for PDF, so it's clearly well-within Tableau's capabilities

                    • 7. Re: Printing a public dashboard results in corrupted output
                      Jonathan Bowen

                      Dustin - was there an answer to this issue? I am getting the same problem (although using the licensed version of Tableau 8, not the public version). I want to embed a chart into a web page, then let my users print this if necessary. The print is corrupted - IE, FF, Chrome, and also if I print to paper or PDF.

                      • 8. Re: Printing a public dashboard results in corrupted output
                        Dustin Smith

                        Hi Jonathan,


                        Thanks for reminding me about this question that Colin initially asked. 


                        Here is what I found out: The ability to have interactive visualizations that are serving up dynamic content look pixel perfect across every browser type is actually not an easy thing to do.  I had a great 20 min. conversation with one of our developers on this (because I got curious).  Now throw in the ability to guarantee that CNTL + P will always print exactly right and you've got is quite a "fun" technical challenge with about as many subtle browser rendering issues as you can point to.  Effectively our team wanted to guarantee a really good printing experience across any browser and the best way to do that was the "view as PDF" button option.


                        For the use cases you and Colin are outlining where the content is embedded within a webpage and you want to capture everything with a simple print screen command, the PDF option doesn't work as well.  Apparently there are some folks who have done some technical work arounds where an embedded dashboard in a page only uses a static png until someone mouses over it/attempts to interact with it.  This means that a print screen command works bettter, however there is some client side scripting that has to be done and I'm not familiar with the specifics of that solution.


                        My guess is that there are probably lots of people interested in Tableau putting some more work into this functionality.  I'd recommend starting up an idea and lettering people vote it up to increase visibility: http://community.tableau.com/community/ideas





                        • 9. Re: Printing a public dashboard results in corrupted output
                          Colin Young

                          Thanks for following up. I have to retract a previous statement I made suggesting that I didn't think Tableau was actively disabling the ability to print. I did a bit of digging and discovered that the software is in fact disabling printing. There are 3 CSS files that control the display. They are set to media="screen" which means the printer doesn't use them. When I used a proxy to modify the HTML being returned to the browser to strip out that restriction I was able to get a reasonably clean printout:

                          Photo 1.jpg

                          I don't buy the argument that it's too difficult to also deal with printing from the browser. At the very least, simply removing the CSS media restriction would get a mostly-there solution (I am a software developer so I understand that while it might seem like a simple fix it needs to go through business analysis, implementation, QA, etc.).


                          There already is a suggestion for printing embedded visualizations: http://community.tableau.com/ideas/1348


                          I'll update that with votes and comments detailing why PDF export is such a poor option.

                          • 10. Re: Printing a public dashboard results in corrupted output
                            Dustin Smith



                            This is great feedback and thanks for taking the time to dig a little deeper.  Will you be sure to leave a comment in the Idea you linked to and point back to this thread.  This is a super valuable conversation that I want more people to see.



                            • 11. Re: Printing a public dashboard results in corrupted output
                              Amit Yeshayahu

                              Hi Colin ,



                              How can I add the 3 CSS files  ? until now i worked without them , but i want to print my embedded views  .




                              Many Thanks in Advanced  ,


                              • 12. Re: Printing a public dashboard results in corrupted output
                                Wesley Smith

                                I'm running into the same problem.  My screen looks great but printing from the browser dialog doesn't work.  In fact, it gives me a blank screen.  The best solution would be a print-to-pdf button that would enable the user to dump the contents of the active dashboard to a pdf file, but while waiting for that, how does one tweak the css to enable printing from the browser dialog?


                                Thanks!   Wes

                                • 13. Re: Printing a public dashboard results in corrupted output
                                  Corey Turner

                                  If the default browser printing ability is one that isn't a priority, I think it makes sense for Tableau to at least do some work to intercept the "Ctrl-P" shortcut with javascript. Maybe they show the download pdf dialog window?