问题标签 [pixelate]
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.
c - 如何像素化图像
我正在尝试通过以下步骤对 P6 PPM 格式图像进行像素化:
- 读取 4x4 网格中的 PPM 图像
- 查找每个 4x4 网格的平均 RGB 颜色值
- 通过将新图像中的每个 4x4 像素网格设置为具有平均 RGB 颜色值来写入新文件。
PPM 文件以以下格式开始:
我的问题: 输出 PPM 图像文件(我使用 GIMP 图像编辑器打开,也可以在记事本等任何文本编辑器中打开以查看原始数据)由一个平面颜色块组成,而它应该类似于一种马赛克。
注意: 4x4 网格可以变化,即网格尺寸的值越高,输出图像的像素化程度越高。我的代码主要受到另一个 Stack Overflow 问题的影响,用户在 C# 中尝试了类似的实现。这个问题的链接: https ://codereview.stackexchange.com/questions/140162/pixelate-image-with-average-cell-color
更新:输出现在似乎像素化了图像的前 1/5,但输出图像的其余部分仍然是一个色块。我认为我的问题在于我将单元格视为线性顺序的像素。
我的尝试:
python - 如何在 Python 中使用 OpenCV 像素化图像?
此链接中的最佳答案如何使用 python 将方形图像像素化为 256 大像素?用于PIL
像素化图像。可以将图像从 转换PIL
为 ,cv2.Mat
但我不允许使用其他库,而且我找不到使用 opencv 的任何好方法。
有没有办法OpenCV
只在 Python 中使用库来像素化图像?任何示例图像都可以。非常感谢我可以控制以供以后调整的像素大小参数的解决方案。
c - 如何像素化二进制 (P6) PPM 文件
我正在努力像素化由存储在二进制(P6) PPM 文件中的 RGB 值组成的图像。像素化图像的步骤如下:
- 读入二进制数据并将其存储在一维数组中
- 在大小为“c”(行 x 列)的单元格中迭代存储在此数组中的数据。这个变量“c”可以由用户更改,但对于这个程序,它当前设置为
int c = 4;
意味着它迭代块尺寸的像素数据4 x 4
- 现在找到每个大小为“c”的单元格中的平均颜色值
- 将每个平均颜色值输出到新的输出 PPM 文件
每个二进制 PPM 文件都以以下格式的标题开头,由“幻数”组成,然后是宽度、高度,最后是最大颜色值 255。标题注释被忽略。以下标题示例显示格式为 P6(因此为二进制文件)的 PPM 图像,宽度为 16,高度为 16,最大颜色值为 255:
我在哪里挣扎:
- 我不确定如何找到每个单元格的平均 RGB 值,然后将其输出到新的数据流。在线性读取数据(即不将其读取到数组(或缓冲区)中)时,我想出了一种方法来执行此操作,方法是将该单元格中的总颜色除以循环迭代次数,但事实证明这是不正确的。
- 嵌套的 for 循环是否以改变输出图像方向的方式排序,例如它是否将其旋转 180 度等?我正在努力通过读取原始二进制数据来确定这一点。
我的尝试:
html - 如果可以在没有画布的情况下为图像像素化设置动画,则仅使用 CSS
因此,您可以通过执行以下操作在 CSS 中获得像素化:
- 设置
background-image
为非常小的图像(例如 50 像素或 100 像素)。 - 设置
image-rendering: pixelated
在元素上。
这会给你像素化的外观。
现在我想通过在浏览器完成下载后用大图像替换“非常小的图像”来制作动画:
问题有两个方面。
- 我想要使
background-image
用background-size: cover
它来正确填充容器元素。所以你不能在任何像素化动画中使用背景大小。 transform: scale(0.1)
(以接近原始像素化大小)不起作用,因为它会缩放整个元素。
我想做这样的事情:动画transform: scale(x)
从 50px 像素化图像到 2000px 非像素化图像,超过 0.3 或 0.5 秒。但这不起作用。我想也许使用背景大小,但由于限制,这也不起作用。
想知道是否有任何方法可以做到这一点。
我已经看到这个使用画布进行像素化。想知道是否没有其他解决方案可以在不使用 JS/canvas 的情况下工作。
javascript - 为什么这个像素化动画很震撼
我有以下多步像素化动画。它从低像素到高像素的动画非常缓慢,以向您显示它在某些步骤之间颠簸,就好像图像在渲染之间略微移动一样。我无法弄清楚为什么会发生这种情况或如何使它看起来好像图像停留在一个地方。
即使在最后两个步骤之间,它也会轻微移动。想知道出了什么问题以及如何解决它。
仅供参考,有两个图像,一个小的和一个大的,都是一样的。它首先以低分辨率加载小图像,然后加载大图像。在加载大图像时,它会使用小图像执行一些动画步骤来启动动画。然后,一旦大的图像完成,它会从小图像停止的地方开始,并使用大图像执行更多的动画步骤。
javascript - 如果您可以在 JavaScript 中为像素化的画布方块制作动画
因此,您可以像这样在画布上绘制图像来像素化图像:
我想知道是否有一种方法可以确定正方形在画布中的位置以及它们的颜色,以便您可以对它们做一些事情,例如(在这种情况下)为它们设置动画,使它们看起来像闪闪发光,或者更简单地让它们像波浪一样来回动画。
mask - 使用图像蒙版像素化/模糊图像部分
我需要使用 tif 格式的蒙版图像对图像的某些部分进行像素化。
在 ImageMagick 中有多种选择,例如:
源图像和 unsharp_mask 图像具有相同的大小:3840 x 2160
unsharp_mask 图像被填充为黑色,除了需要像素化的区域,它们在源图像中是白色的。
我怎样才能用 GraphicsMagick 做到这一点?
有没有一种简单的方法可以达到同样的效果?
java - 使用处理和 Opencv 进行像素化人脸跟踪
我正在尝试获取实时处理视频流以实时进行面部检测和像素化面部。我有代码可以跟踪面部并在面部周围绘制一个矩形,并且我有一个单独的草图来对整个框架进行像素化,但是我无法弄清楚如何将像素化限制在面部矩形内。任何有关如何将两者合并在一起的建议将不胜感激。
我的面部跟踪代码是:
我的像素化代码是:
dynamic - ffmpeg - How to change the filter-paramaters depending on time oder framenumber?
Hallo to all userse and helpers here in this forum! Thank you, i am new and i have found allready a lot of solutions.
Now I want to ask, if someone can help me:
I have a Movie about 30 seconds made of 1 image. Now I want to pixelate depending on time or framenumber - every time a litlle bit less. My code so far:
ffmpeg -i in.mp4 -vf scale=iw/n:ih/n,scale=niw:nih:flags=neighbor out.mp4
where n should be the framenumber 1 to 900. this scould also be t+1 for slower change.
the stars are gone - so i mean n times iw:n times ih:
error-massage:
undefined constant or missing '(' in 'n' error when evaluating the expression 'ih/n' maybe the expression for out_w:'w/n' or for out_h:'ih/n' is self-referencing. failed to configure output pad on paresed_scale_0 error reinitializing filters! failed to inject frame into filter network: invalid argument error while processing the decoded data for stream #0:0
Do you have some suggestion plaese - Thank you in Advance