javascript - 从图像 URL javascript html 保存图像文件

标签 javascript html

我是 JS 和 HTML 的初学者。 我正在从事某个生成饼图的项目,我正在使用带有 HTML API 的谷歌图表。

我设法制作了图表并获得了图像 URL。 当我调用这条线时: window.open(URL); 将打开一个包含图片的新窗口。 我的问题是,是否有一种类似的方法可以获取 URL 并将图像下载到项目文件夹中? 像 download(URL,'PNG'); 甚至 download(URL);?

最佳答案

如果您试图允许最终用户下载该图像,请参阅此问题: Download image with JavaScript

如果您尝试下载图像以在页面中使用,为什么不使用标签并远程引用它呢?

    <img src="[url retrieved from the api]">

请记住,Javascript 是在客户端运行的,因此任何下载函数都会下载到最终用户,而不是项目文件夹。

编辑:对使用的代码进行了修改并进行了实现。

The fiddle .

我从 Google Chart 文档“Printing PNGs”中提取。以下是他们的做法:

//Your data and options initialization up here 
....

//Event listener
google.visualization.events.addListener(chart, 'ready', function () {
    chart_div.innerHTML = '<img src="' + chart.getImageURI() + '" download="chart.png">';
    console.log(chart_div.innerHTML);
}); 

//Actually draw the chart
chart.draw(data, options);

只需使用其他 SO 链接即可完成下载过程!

关于javascript - 从图像 URL javascript html 保存图像文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36732271/

相关文章:

javascript - 尝试匹配名字标题..或不匹配,视情况而定

html - iPad2、iPhone 4S 上的 iOS 网站加载问题

android - 用于 html-android 的 FFmpeg mp4 编码器

javascript - jQuery ('select:focus' ).blur() 在 Safari 和 Edge 中不工作

html - 使用 materializecss 将图像与相应的表对齐

javascript - 如果 margin-left = 0px,我如何更改我的 margin-left-increase 函数以禁用?

javascript - 你如何创建一个像 jquery 一样充当函数的包装器对象

javascript - 点击外网链接后通过MySQL保存数据

javascript - jquery如何访问函数内部的函数

javascript - 向 JavaScript 原型(prototype)添加多个方法?