Question

我正在使用javascript和google图表在visual studio中制作应用程序。我想记录图形，我发现的选项在IE中不起作用。

举例并修改它，我可以将图像移动到另一个容器<img id = "chartImg" />，在同一页面上以这种方式保存png格式。我还想一个弹出窗口来充电图像记录。我无法直接在弹出窗口中创建图像，而不将容器<img id = "chartImg" />传递给窗口。我不想要容器。

由于我可以创建弹出窗口，因此可以直接从SVG创建，方法是使用Google Chart API绘图，按下按钮或单击我。

代码将它放在jsFiddle中。

http://jsfiddle.net/rdmghzhm/3/

如下：

HTML

<div id="visualization"></div>
Right-click this image to save it:<br />
<a href="#" onclick="openWin()">click</a>
<img id="chartImg" />

JAVASCRIPT

function drawVisualizationDaily() {
    // Create and populate the data table.
    var data = google.visualization.arrayToDataTable([
        ['Daily', 'Sales'],
        ['Mon', 4],
        ['Tue', 6],
        ['Wed', 6],
        ['Thu', 5],
        ['Fri', 3],
        ['Sat', 7],
        ['Sun', 7]
    ]);

    // Create and draw the visualization.
    var chart = new google.visualization.ColumnChart(document.getElementById('visualization'));
    google.visualization.events.addListener(chart, 'ready', function () {
        var imgUri = chart.getImageURI();
        // do something with the image URI, like:
      document.getElementById('chartImg').src = imgUri;
    });

    chart.draw(data, {
        title:"Daily Sales",
        width:500,
        height:400,
        hAxis: {title: "Daily"}
    });
}  
google.load('visualization', '1', {packages:['corechart'], callback: drawVisualizationDaily});

function openWin() {  
   var divText = document.getElementById("chartImg").outerHTML;   
    var myWindow = window.open('', '', 'width=500,height=500');
   var doc = myWindow.document;
   doc.write('<img' + ' id="graficar" ' +' />');
   doc.write(divText);
   doc.write("<p>This is 'myWindow'</p>");
   doc.close();
}

Answer 1

您可以在DIV中隐藏您在主页面上创建的图像，代码html将如下所示。

<div id="visualization"></div>
Right-click this image to save it:<br />
<a href="#" onclick="openWin()">click</a>
<div style="display:none;">
<img id="chartImg" />
</div>

在jsFiddle严重：

http://jsfiddle.net/3Lx91o0e/

问候

如果Chrome出现小错误，要创建弹出窗口，它仍然会用鼠标右键录制图像。 windows.open必须使用完整参数调用，此代码在Chrome和其他地方也能正常工作，我只能在IE 11中尝试

 var myWindow = window.open("about:blank", "Save graph", "location=0,resizable,status=0,menubar=0,titlebar=0,left=5,top=5");

谷歌图表保存图表，弹出窗口

1 个答案: