title: How to export amChart with transparent background?
body: <p>How to export amChart with transparent background?</p>
  
  <p>Here, is my code:</p>
  
  <pre><code>var chartData = [{
          "country": "USA",
          "visits": 4025,
          "color": "#FF0F00"
      }, {
          "country": "China",
          "visits": 1882,
          "color": "#FF6600"
      }, {
          "country": "Japan",
          "visits": 1809,
          "color": "#FF9E01"
      }, {
          "country": "Germany",
          "visits": 1322,
          "color": "#FCD202"
      }, {
          "country": "UK",
          "visits": 1122,
          "color": "#F8FF01"
      }, {
          "country": "France",
          "visits": 1114,
          "color": "#B0DE09"
      }, {
          "country": "India",
          "visits": 984,
          "color": "#04D215"
      }, {
          "country": "Spain",
          "visits": 711,
          "color": "#0D8ECF"
      }, {
          "country": "Netherlands",
          "visits": 665,
          "color": "#0D52D1"
      }, {
          "country": "Russia",
          "visits": 580,
          "color": "#2A0CD0"
      }, {
          "country": "South Korea",
          "visits": 443,
          "color": "#8A0CCF"
      }, {
          "country": "Canada",
          "visits": 441,
          "color": "#CD0D74"
      }, {
          "country": "Brazil",
          "visits": 395,
          "color": "#754DEB"
      }, {
          "country": "Italy",
          "visits": 386,
          "color": "#DDDDDD"
      }, {
          "country": "Australia",
          "visits": 384,
          "color": "#999999"
      }, {
          "country": "Taiwan",
          "visits": 338,
          "color": "#333333"
      }, {
          "country": "Poland",
          "visits": 328,
          "color": "#000000"
      }];
  
  
      var chart = AmCharts.makeChart("chartdiv", {
          type: "serial",
          theme: "light",
          dataProvider: [{
              "year": 2005,
              "income": 23.5,
              "expenses": 18.1
          }, {
              "year": 2006,
              "income": 26.2,
              "expenses": 22.8
          }, {
              "year": 2007,
              "income": 30.1,
              "expenses": 23.9
          }, {
              "year": 2008,
              "income": 29.5,
              "expenses": 25.1
          }, {
              "year": 2009,
              "income": 24.6,
              "expenses": 25
          }],
          categoryField: "year",
          startDuration: 1,
          rotate: true,
  
          categoryAxis: {
              gridPosition: "start"
          },
          valueAxes: [{
              position: "top",
              title: "Million USD",
              minorGridEnabled: true
          }],
          graphs: [{
              type: "column",
              title: "Income",
              valueField: "income",
              fillAlphas: 1,
              balloonText: "&lt;span style='font-size:13px;'&gt;[[title]] in [[category]]:&lt;b&gt;[[value]]&lt;/b&gt;&lt;/span&gt;"
          }, {
              type: "line",
              title: "Expenses",
              valueField: "expenses",
              lineThickness: 2,
              bullet: "round",
              balloonText: "&lt;span style='font-size:13px;'&gt;[[title]] in [[category]]:&lt;b&gt;[[value]]&lt;/b&gt;&lt;/span&gt;"
          }],
          legend: {
              useGraphSettings: true
          }
  
      });
      var image = new Image();
      var btn = document.getElementById('export');
      btn.onclick = function () {
          var tmp = new AmCharts.AmExport(chart);
          tmp.init();
          tmp.output({
              output: 'datastring',
              format: 'jpg', "backgroundColor": "gray",
              "backgroundAlpha": 0.3,
  
  
  
  
          }, function (blob) {
  
              image.src = blob;
  
              console.log(image.src);
              document.body.appendChild(image);
  
            //  var doc = new jsPDF('landscape');
            //  doc.addImage(image, 'JPEG', 10, 10 );
            //  doc.save('testingPDF.pdf');
              printGraph1();
          });
  
     function printGraph1() {
          var source = "../../Content/images/print-background.png";
          var html = "&lt;html style=' margin:0;height:100%;overflow:hidden;'&gt;&lt;head&gt;&lt;script&gt;function step1(){\n" +
                 "setTimeout('step2()', 10);}\n" +
                 "function step2(){window.print();window.close()}\n" +
                 "&lt;/scri" + "pt&gt;&lt;link rel='stylesheet' href='http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css'&gt;&lt;style type='text/css' media='print'&gt;&lt;/style&gt;&lt;/head&gt;&lt;body style=' margin:0;height:100%;overflow:hidden;' onload='step1()' style='background-image: url(' " + source + "')'&gt;\n" +
                 "&lt;img src='" + source + "' style=' min-height:100%; min-width:100%;height:auto;width:auto;position:absolute; margin:auto;z-index:-1; '/&gt;";
  
  
          //$(".chartdata").height(700);
          //$(".chartdata").width(300);
          // $("#chart").css({'position': 'absolute', 'margin': 'auto', 'top': '0', 'right': '0','bottom': '0' ,'left': '0'});
          // var divContent = $(".chartdata").html();
          //var image1 = new Image();
          //image1.src = image.src;
  
          console.log(image.src);
          var divCon = "&lt;div  style='width:100% position: absolute; margin: auto; top: 30%; right: 0;bottom: 0; left: 0; '&gt;";
          var divConEnd = "&lt;/div&gt;";
          //var imgDiv = "&lt;div id='imge'&gt;&lt;/div&gt;";
          //$("#imge").appendChild(image);
          //var img = "&lt;img src='" + image.src + "/&gt;";
  
          Pagelink = "about:blank";
          var pwa = window.open(Pagelink, "_new");
  
          pwa.document.open();
  
          pwa.document.write(html);
  
          //pwa.document.write(divCon);
          pwa.document.write("&lt;div  style=' position: absolute; margin: auto; top: 30%; '&gt;");
          pwa.document.write("&lt;img  style=' background-color:blue; 'src='" + image.src + "'/&gt;");
          //pwa.document.body.appendChild(image);
          pwa.document.write("&lt;/div&gt;");
         // pwa.document.write(divConEnd);
          pwa.document.write("&lt;button type='submit' class='btn btn-primary'&gt;Submit&lt;/button&gt;");
          pwa.document.write('&lt;/body &gt;&lt;/html&gt;');
          pwa.document.close();
      }
  </code></pre>
  
  <p><a href="http://i.stack.imgur.com/6eN1F.png" rel="nofollow">enter image description here</a></p>