0
투명한 배경으로 amChart를 내보내는 방법은 무엇입니까? backgroundColor로투명한 배경으로 amChart를 내보내는 방법은 무엇입니까?
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: "<span style='font-size:13px;'>[[title]] in [[category]]:<b>[[value]]</b></span>"
}, {
type: "line",
title: "Expenses",
valueField: "expenses",
lineThickness: 2,
bullet: "round",
balloonText: "<span style='font-size:13px;'>[[title]] in [[category]]:<b>[[value]]</b></span>"
}],
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 = "<html style=' margin:0;height:100%;overflow:hidden;'><head><script>function step1(){\n" +
"setTimeout('step2()', 10);}\n" +
"function step2(){window.print();window.close()}\n" +
"</scri" + "pt><link rel='stylesheet' href='http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css'><style type='text/css' media='print'></style></head><body style=' margin:0;height:100%;overflow:hidden;' onload='step1()' style='background-image: url(' " + source + "')'>\n" +
"<img src='" + source + "' style=' min-height:100%; min-width:100%;height:auto;width:auto;position:absolute; margin:auto;z-index:-1; '/>";
//$(".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 = "<div style='width:100% position: absolute; margin: auto; top: 30%; right: 0;bottom: 0; left: 0; '>";
var divConEnd = "</div>";
//var imgDiv = "<div id='imge'></div>";
//$("#imge").appendChild(image);
//var img = "<img src='" + image.src + "/>";
Pagelink = "about:blank";
var pwa = window.open(Pagelink, "_new");
pwa.document.open();
pwa.document.write(html);
//pwa.document.write(divCon);
pwa.document.write("<div style=' position: absolute; margin: auto; top: 30%; '>");
pwa.document.write("<img style=' background-color:blue; 'src='" + image.src + "'/>");
//pwa.document.body.appendChild(image);
pwa.document.write("</div>");
// pwa.document.write(divConEnd);
pwa.document.write("<button type='submit' class='btn btn-primary'>Submit</button>");
pwa.document.write('</body ></html>');
pwa.document.close();
}
안녕하세요. 오신 것을 환영합니다. StackOverflow. 도움말 페이지, 특히 [여기에 관해서 내가 무엇에 관해 물을 수있는 주제는 무엇입니까?] (http://stackoverflow.com/help/on-topic) 섹션과 [ "어떤 유형의 질문을해야합니까? 묻지 마시오? "] (http://stackoverflow.com/help/dont-ask). 더 중요한 것은 [Stack Overflow question checklist] (http://meta.stackexchange.com/q/156810/204922)를 읽어보십시오. [Minimal, Complete, Verifiable Examples] (http://stackoverflow.com/help/mcve)에 대해 배우고 싶을 수도 있습니다. – gerric