问题标签 [todataurl]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
2 回答
764 浏览

javascript - 无法获取 AJAX 的 post 值(纯 Javascript)

我知道这个问题在这个论坛中得到了回答(Unable to get values in POST php web serivce),但是问题和答案都使用了 jQuery,就我而言,我不能使用它(不管为什么) ...

因此,我有一个 Javascript 文件,旨在制作画布的“屏幕捕获”(使用“toDataURL()”函数)并使用 AJAX 将其发送到 PHP 文件。由于要发送的数据很长,不能使用“GET”方法(AJAX返回414错误:“URL TOO LONG”),所以需要使用“POST”。

我遵循了一些关于纯 Javascript的示例(这绝不容易找到,因为每个人都使用 jQuery!:P),我的代码如下所示:

当尝试记录“dataURL”变量的内容时,它会记录一个像“image/png...blablabla”这样的大字符串,所以我认为数据是按预期生成的。

此时,PHP 文件只是尝试检索结果:

但是,PHP 文件没有回显“POST”或“GET”消息,“ImgData”回显返回空,并且没有回显“成功”或“处理图像时出错”消息......所以看起来PHP 文件无法检索AJAX 的“POST”方法传递的数据。

我究竟做错了什么?我怎么能只使用普通的 Javascript来解决这个问题(不使用 jQuery 很重要)?

提前感谢您的时间和精力!:)

0 投票
1 回答
884 浏览

canvas - Fine Uploader - 添加 Blob (canvas.toDataURL) - 上传到 S3

我的页面通过单击按钮复制用户 html5 画布:

我现在需要使用精细上传器将其上传到我的 s3 存储桶。在文档中它提到我可以上传 blob:

我将如何最好地集成它以保存并取回 tempLink?我会像使用普通选择的文件一样使用下面的 S3 结构和签名、请求等吗?这个链接如何addBlobs

0 投票
1 回答
884 浏览

django - 使用 django 将图像从客户端保存并加载到服务器

这是我从客户端发送数据的方式(coffeescript & dajaxice):

这是我将图像保存在服务器上的方法(取自此答案

我想加载图像并像这样发送它:

但这并没有给我完全相同的数据,而且我的客户无法绘制返回的图像。imageData 以2OWn9u2我写它和2OWn读它的时候结束(缺少'9u2')。

0 投票
1 回答
1691 浏览

svg - Black area when exporting graph from svg (d3.js) to jpg

I am trying to export a graph from SVG (obtained through d3.js) to a JPG image using javascript.

The fact is that the final image do not show the picture properly but it draws a black area enclosing the lines of the graph. Here they are the two images. At the top of the page the SVG is represented whereas the final JPG image is depicted.

The code I have written is the following:

Anyone knows the reason of the wrong colours transformation? Thanks in advance!

0 投票
1 回答
467 浏览

filepicker.io - 使用 Filepicker.io exportWidget 将 dataURL 保存为图像

似乎使用 Filepicker.io javascript API 可以保存 dataURL,但我想知道是否可以使用 Filepicker.io 导出小部件将 dataURL mime-typed 保存为“image/png”?当我尝试这样做时,我得到一个异常:要导出的文件无效。我读到使用 JS API 需要去掉“data:image/png;base64”前缀,但这似乎给出了同样的例外。

我像这样剥离它:

但这似乎引发了同样的错误。知道 Filepicker 小部件是否可以做到这一点?

0 投票
1 回答
2058 浏览

javascript - Django/Python/toDataURL 返回带有来自 toDataURL 的字符串的响应

我在数据库中保存了一个由 javascript 方法 toDataURL 返回的字符串。此处提供了一个示例:http : //pastebin.com/0Qu8rngD

我需要在 django 响应中返回图像。就像是:

我用base64decode、urlsafe_b64decode、Image ...尝试了很多方法,但没有成功。导航器不显示图像,它无法读取响应数据。

当然,我可以在 HTML 页面中显示我的图像<img src="{{image}}">,效果很好。

0 投票
1 回答
1199 浏览

javascript - toDataURL 使 Chrome 崩溃

所以我正在为three.js 开发一个Tile Renderer,一切似乎都在工作。

它的作用方式如下:

a)创建一堆摄像机,b)在每个摄像机中渲染场景 c)创建一个“toDataURL”,并下载它。

一些代码:

现在因为我多次这样做,(理想情况下是任意大的次数)。它最终可能会产生数百张图像。

这样做会使我的 chrome 标签崩溃。从字面上看,每次。我想知道是否有办法阻止这种情况发生?在我运行 chrome 时设置一个标志,或者对代码做一些事情。我尝试过为每个渲染调用设置超时(AKA 暂停渲染器,而不是渲染 1 个图像并每 10 秒保存一次),但即使这样似乎也不起作用。

您可以在此处查看崩溃:http: //cabbi.bo/ENOUGH/(按“p”尝试捕获图像,页面需要一点时间才能加载)。

预先感谢您的帮助!

艾萨克/卡比博

0 投票
0 回答
103 浏览

google-chrome - Chrome canvas.toDataURL webp 红转蓝

我尝试使用“toDataURL”(质量 1.0)从画布中获取 webp 图像。但问题是图像的许多部分都变蓝了。

我在网上找不到有关此问题的任何信息。

似乎每一种红色的颜色都变成了蓝色。

0 投票
2 回答
6150 浏览

javascript - 使用 toDataURL() 从 Canvas 导出时如何压缩 .png 图像?

需要使用 HTML5 画布生成大小约为 20k 的 .png 图像。不幸的是,当使用 toDataURL() 方法创建 .png 时,您无法像使用 jpeg 那样指定质量。

任何解决方法的想法?toDataURL 似乎是从 Canvas 生成图像的唯一方法,而 canvas 似乎是无需服务器交互的图像处理的最佳工具。感谢任何建议。

0 投票
0 回答
81 浏览

javascript - 有没有办法从背景图像中获取画布数据

我目前有一个界面,其中包含您可以滑动浏览的产品图像列表。仅 - 这些图像被设置为 div 的背景图像,因此我可以使用 CSS 的 background-size:cover 方法来处理图像的大小。

我想要做的是在这些背景图像中获取主色,并将页面背景设置为该颜色。我已经成功实现了这个库以获取主色并完成此操作,但为了做到这一点,我必须获取背景图像中使用的 URL,使用该 URL 作为 SRC 创建一个新图像,添加临时图像到 DOM 以获取主色,然后删除临时图像。它真的很慢,我觉得可能有更好的方法。

有谁知道我如何能够更快地做到这一点?最好直接从包含背景图像的 div 中采样颜色,而不必渲染新图像?这是我的代码: