Question

我有以下代码来保存Google聊天中的图片：

我的HMTL;

   function getImgData(chartContainer) 
   {
        var chartArea = chartContainer.getElementsByTagName('iframe')
[0].contentDocument.getElementById('chartArea');

        var svg = chartArea.innerHTML;
        var doc = chartContainer.ownerDocument;
        var canvas = doc.createElement('canvas');
        canvas.setAttribute('width', chartArea.offsetWidth);
        canvas.setAttribute('height', chartArea.offsetHeight);


        canvas.setAttribute(
            'style',
            'position: absolute; ' +
            'top: ' + (-chartArea.offsetHeight * 2) + 'px;' +
            'left: ' + (-chartArea.offsetWidth * 2) + 'px;');
        doc.body.appendChild(canvas);
        canvg(canvas, svg);
        var imgData = canvas.toDataURL('image/png');
        canvas.parentNode.removeChild(canvas);
        return imgData;
  }

  function saveAsImg(chartContainer) 
  {
      var data = getImgData(chartContainer);
      window.location = data.replace('image/png', 'image/octet-stream');
  }

问题是向用户询问该位置，我想直接保存它，我的意思是，在没有询问任何特定位置的情况下，由于我需要在服务器端将此图像包含到pdf文件中之后需要此位置，所以我需要知道位置，我需要对用户进行透明处理。

非常感谢你。

Answer 1

您是否希望将图像保存在服务器上而不是客户端？如果是这样，您将需要服务器上的服务，该服务可以接受上载中的图像并将其另存为文件。然后你可以通过AJAX发送图像，如下所示：

function uploadImage (chartContainer) {
    // using jQuery AJAX
    $.ajax({
        url: '/path/to/image/save/service',
        data: {
            image: getImgData(chartContainer)
        },
        type: 'POST'
    });
}

这可能需要调整才能完全正确，但基本概念已经到位。

将图表图像保存在特定位置GWT中

1 个答案: