从画布下载图像：下载的图像是空白的答案

【问题标题】：Downloading image from a canvas: downloaded image is blank从画布下载图像：下载的图像是空白的
【发布时间】：2014-11-07 02:23:33
【问题描述】：

我正在使用 Open Seadragon 在页面上显示深度缩放图像。我想包含一个下载图像的链接。除了下载的图像是空白的之外，我大部分时间都在工作。

Here is my fiddle

这是我正在使用的代码

function seadragon(){
    var url = "http://26.img.americanancestors.org/8e09e1f1-e1e9-4414-a0f5-86a6f09454a2.xml";

    var viewer = OpenSeadragon({
                    id: "databaseviewer",
                    prefixUrl: "../../Scripts/openseadragon/images/",
                    tileSources: url,
                    maxZoomLevel: 20
                });

    viewer.addHandler('open', function() {
                    var img = viewer.drawer.canvas.toDataURL("image/png");
                    console.log(img);
                    var downloadlink = document.getElementById("download");
                    downloadlink.href = img;
                    downloadlink.download = 'SeadragonImage';

                });
}

seadragon();

【问题讨论】：

标签： image pdf canvas download seadragon

【解决方案1】：

自从 6 年前发布此问题以来，问题中提供的网址似乎不再有效。但我只是有类似的问题，所以分享答案以防其他人有这个问题。这是 url ='https://pgalawfirm.com/wp-content/uploads/2017/05/pga-logo-mobile-view.png' 的另一个示例。请注意，此代码适用于非 svg 图像。 (jpg, jpeg, ico)

使用标准方法下载此图像会导致下载看似空白的图像。那是因为，像这样的一些图像（模式'RGBA'）实际上是全白的，你在网站上看到它们的原因是因为透明度参数 alpha。因此，您将全白图像下载到白色背景上，因此它们看起来“空白”。这是如何检查图像是否为全白的代码，如果是，则更改背景然后保存。

import numpy as np
from statistics import mean
import PIL.Image
import requests
from tqdm import tqdm

image_url = 'https://pgalawfirm.com/wp-content/uploads/2017/05/pga-logo-mobile-view.png'
filename = 'non_blank_image.png'

def transparency_factor(im):
    matrix_img = np.asarray(im)
    w = im.width 
    h = im.height
    mean_distribution =[]
    for i in range (0, w):
        r = mean(matrix_img[:,i,0])
        g = mean(matrix_img[:,i,1])
        b = mean(matrix_img[:,i,2])
        mean_distribution.append(mean([r,g,b]))
        avg_colour =[mean([r,g,b])]
    if avg_colour[0] == 255:
        transparency_factor = True
    else:
        transparency_factor = False
    return transparency_factor

def remove_transparency(im, bg_colour=(200, 200, 200)):        
    if im.mode in ('RGBA', 'LA') or (im.mode == 'P' and 'transparency' in im.info):     
        alpha = im.convert('RGBA').split()[-1]        
        bg = PIL.Image.new("RGBA", im.size, bg_colour + (255,))
        bg.paste(im, mask=alpha)
        return bg
    else:
        return im

def download_image(image_url): # any type apart from svg

    response = requests.get(image_url, stream=True)                
    file_size = int(response.headers.get("Content-Length", 0))       

    progress = tqdm(response.iter_content(1024), f"Downloading {filename}", 
total=file_size, unit="B", unit_scale=True, unit_divisor=1024)
    with open(filename, "wb") as f:
        for data in progress.iterable:                     
            f.write(data)
            progress.update(len(data))  

download_image(image_url)            
im = PIL.Image.open(filename)
im.mode
if im.mode == 'RGBA':
    if transparency_factor(im):
        im = remove_transparency(im) 
        im.save(filename)

【讨论】：

【解决方案2】：

您需要等到所有图块都加载完毕。对于常规使用来说，这不是问题，因为用户可能在看到某些东西之前不会点击按钮。

【讨论】：