How to export the whole page or html content with Highcharts not just the chart?

highcharts, image, javascript, jquery, php

Solution

i found a simple workaround for exporting charts (printing)

and

i didn't use any plugin just little plain old css and some javascript

which in my case is

i wanted to print the chart with some specific html content of the page

or in my case i wanted to remove header , footer and left menu

i dint wanted to show buttons or unecessary content

and just show the page content , description table and chart

so here is i how i achieved it.

> CSS :-

<style type="text/css">
@media print{
@page
        {
            size: auto;   /* auto is the initial value */
            margin: 0mm;  /* this affects the margin in the printer settings */
        }
  body{ background-color:#FFFFFF; background-image:none; color:#000000 }
  .navimainbg{ display:none;}
  .printhide{ display:none;}
  .usercontent-footer{ display:none;}
  .linkBTN{ display:none;}
  .userheader{ display:none;}
  .user-profile-left{ display:none;}
  #userbgcontent{ width:100%;}
}
</style>

We are focussing on the print css here which we implied when the page is printed

acess the divs or portions of the page which you dont want ot be printed via their class or id depending upon your usage

for example

i didnt wanted to display the button

 .linkBTN{ display:none;}

which can be simply called via javascript.

Javascript :->

<script type="text/javascript">


function printpage()
{
     
window.print()
}

<script type="text/javascript">

we can invoke the print function to print the page minus elements we dont want to print with the page via click of a button by calling function in my case "printpage" as you can see this button will also not display while printing as printhide class display is set to none while priting

<input title="Print a Printer Friendly Page" class ="printhide" type="button" value="Print this page" onclick="printpage()">

isnt is it a simple way to print chart other than highcharts printing if you want to print more

only con is that sometime the image will slide down when you want to show it along with some conetent due to lack of size to render an image . it will shift to next page . other than its tested working .

Problem

Original source

Related problems

• How to save webpage as a image file using PHP?