问题标签 [blurry]

我在这里看到了很多关于 chrome 上模糊 svg 的问题，但我的问题恰恰相反。

我的 svg 在桌面浏览器上很好：safari、ffx、chrome。在 iPhone 上也是如此。

但是当我在我的 Galaxy Note 2 的 android 浏览器上运行我的 svg 时，它变得非常模糊。所以我在那个设备上安装了 chrome，然后 svg 就很好了。

我尝试在 css、背景图像和 html 中调整大小并调用标签图像。相同的结果。

原生浏览器安卓

http://www.hostingpics.net/viewer.php?id=923875browserandroid.png

安卓上的chrome浏览器

http://www.hostingpics.net/viewer.php?id=266178chromeandroid.png

我正在使用 DrawingContext 来绘制图像。然后我将结果渲染到 RenderTargetBitmap。我还将画布渲染到相同的 RenderTargetBitmap。尽管像素边界在屏幕上很清晰，但在保存时它们会变得模糊不清。

在下面的屏幕截图中，您可以看到问题（BitmapScalingMode = NearestNeighbor）。

这里是 BitmapScalingMode = HighQuality。它更光滑但不清脆和干净。

这是我的代码的相关部分。您可以看到我尝试在多个位置设置 RenderOptions 但似乎没有效果。

我正在寻找一种方法来防止 WPF 模糊我的图像。我希望我的应用程序在高 DPI 显示器上看起来不错，所以我创建了 96x96px 的图标以显示为 32x32 大小。

在 google 中有很多东西可以找到，甚至在 stackoverflow 上也有一些关于此的主题。总结他们说：启用该属性UseLayoutRounding并设置RenderOptions.BitmapScalingMode为HighQuality. 不幸的是，这对我来说真的不起作用——图像看起来仍然很模糊。然后我在具有更高 DPI aaaand 的笔记本电脑上测试了我的应用程序 - 哇。图像非常清晰漂亮。

我唯一的解决方案是创建一个自定义控件，将 ImageSource 转换为 System.Drawing.Bitmap，在此处重新缩放以匹配图像尺寸并将其转换回 WPF ImageSource。显然不是完美的解决方案！

所以问题是：为什么我的图像在低 dpi 显示器上看起来很模糊？我不知道是什么原因造成的，希望有人有办法解决这个问题。

这是我发现的一些最有用的资源：

1. http://blogs.msdn.com/b/dwayneneed/archive/2007/10/05/blurry-bitmaps.aspx
2. http://www.nbdtech.com/Blog/archive/2008/11/20/blurred-images-in-wpf.aspx
3. http://www.hanselman.com/blog/BeAwareOfDPIWithImagePNGsInWPFImagesScaleWe​​irdOrAreBlurry.aspx
4. 在 WPF 图像上禁用抗锯齿

编辑：

这里要求的是转换 ImageSource 的代码。有几个方法调用不包括在内，但您可以通过 google 快速找到它们。

我正在通过cairo在其图像表面中绘制一些随机矩形，缩放和翻译它并使用显示结果

但矩形似乎模糊：（ 我无法发布屏幕截图）

角（可能）未映射到整数坐标。包含的纹理data大小和格式与surface我已经使用抗锯齿设置相同（文本显示更加模糊！！）。我应该怎么做才能将结果形状映射到整数坐标并提高质量（不使用超级采样并且不放弃缩放转换）？

编辑：我使用了下面的代码（有和没有第三行），它没有工作！：

Edit2：我使用了捕捉乐趣。（毕竟转换代码），但它也没有工作：

当我使用 HTML 和 CSS 将图片显示为其原始大小时，图片就是完美的（当然）。

如果我尝试以大于原始尺寸的尺寸显示它，但如果最终尺寸更小，我预计它会变得模糊。这就是正在发生的事情：我的照片在任何情况下都是模糊的。

问题是网站和图片是响应式的，我无法为所有可能的尺寸创建缩略图，但我仍然需要结果是脆的。至少没有那么模糊。

我在网上搜索并找到了这个 CSS：

它有效，但它给了我完全相反的结果：它太脆了，图片上出现了伪影（点）。我分别尝试了它们，但没有成功。要么全有，要么全无。

就像您在 Photoshop 中拍了一张像样的照片并将锐度滑块推到最大。无论哪种方式，它都太极端而无法使用。

我使用 php、jquery、html 和 css 是否可以使用其中之一解决我的渲染问题？

谢谢。

我正在使用来自 Android SDK 的经典 Imageview 显示图片，但图片模糊。我不明白为什么这是布局中的片段

对于 ImageLoader 我使用这个类

我认为也许它应该是选项，但它不起作用。而这个 o.inScaled = false; o2.inScaled = 假；我从这里得到提示调整大小/缩放位图后图像质量不佳

使用 DOMPDF 时，我的 HTML 文档（使用 Zend Barcode 库生成）上的条形码和 QR 码显示模糊，不像它们在只有黑白像素的 HTML 上那样清晰。我已经阅读了我在谷歌上可以找到的所有内容。更改 DOMPDF_DPI 的值只会影响图像的大小，但无论如何它们都会显示模糊。我对 div 边框有同样的问题。div 的简单 1px 黑色边框显示模糊。在这种情况下只是一个美学问题，但条形码阅读器很难扫描它们，所以我需要解决它。任何帮助将非常感激。非常感谢

我正在尝试创建一个 SVG 动画，该动画在单击元素时平滑地模糊它，然后在再次单击时平滑地取消模糊它（并在每次单击时保持交替）。

所以我有以下SVG：

然后我用这些功能切换显示哪个过滤器：

第一次单击该元素时，它会像应有的那样平滑模糊。但是当我再次单击时，它会在没有任何动画的情况下取消模糊。然后从那时起，它只是在每次点击时在模糊和不模糊之间切换，没有任何动画。

为什么动画只在第一次点击时起作用，我如何让它每次都起作用？

这是一个小提琴：http: //jsfiddle.net/7Pcdp/2/

出于某种原因，在小提琴的 HTML 中内联 SVG 时，动画根本不起作用。如果我将它拆分为一个单独的 .svg 文件，那么它将在 Firefox 中进行动画处理，但只是第一次。

我一直在寻找一种解决方案，为 IE10+ 的背景赋予模糊效果。

我找到了 StackBlur 并让它工作，但在我的情况下它很慢，因为我有一个很大的背景并且希望它尽可能快地呈现。

您知道有一个用于模糊效果的 svg 过滤器，当您拥有像这样的 svg 内容时，它可以正常工作

我想要做的是，把这个 svg 图像用作背景图像。它必须是css背景。我在搜索解决方案时发现了这个小提琴http://jsfiddle.net/vPA9z/3/ 所以我认为这是可能的，但为什么这不起作用http://jsfiddle.net/N2n27/2/

我试图转换 Base64 但仍然没有运气。

SO 上已经有不少“CSS 转换 = 模糊文本”条目，但我认为我在这里有一个独特的笨拙。我已经尝试了所有其他修复但无济于事。

我正在实现 CSS 变换中心/中间对齐方法：

一旦我通过 drawImage 应用图像并调整.centered元素下方的画布大小，文本就会在“半像素”上开始模糊。-webkit-transform-style: preserve-3d修复没有效果。这只发生在 Chrome 和 Safari 中。

这是一支减少了测试用例的笔： http: //codepen.io/andrewtibbetts/pen/owzJa

通过调整窗口大小，您会注意到如果文本不在画布正上方，则模糊停止。