标签: subpixel
推荐指数
解决办法
查看次数
修复CSS流体网格中的子像素舍入问题
我正在尝试创建一个流畅的CSS网格,它适用于Firefox和IE8 +但不适用于Safari/Chrome/Opera,其中子像素舍入问题变得可见:
.column {
float: left;
width: 25%;
}
主容器的宽度为100%,如果您在Safari/Chrome/Opera中更改浏览器大小,则可以看到圆角宽度是如何不一致的.
经过对该问题的广泛阅读后,我理解"子像素舍入没有正确或错误的解决方案",但Firefox方式对我来说似乎是最好的妥协.(例如,如果我设置4个宽度为25%的div,我希望覆盖区域为100%.)
我想知道是否有一个我错过的CSS解决方案,或者一些JavaScript来解决问题.
谢谢!
更新:截至2014年5月,Chrome 33和Safari 7似乎已经采用了"Firefox方式".
推荐指数
解决办法
查看次数
如何让CATextLayer平滑其文本？
根据文档,可以在CATextLayer中启用字体平滑:
Text can only be drawn using sub-pixel antialiasing when it is composited into an existing opaque background at the same time that it's rasterized.
这是我理解这句话的方式:
@implementation CATextLayerWithFontSmoothing
-(id)init {
self=[super init];
if (self) {
CALayer * whiteBackground = [CALayer layer];
CATextLayer * blackText = [CATextLayer layer];
[whiteBackground setBounds:NSMakeRect(0, 0, 300, 300)];
[blackText setBounds:NSMakeRect(0, 0, 300, 300)];
[whiteBackground setBackgroundColor:[NSColor whiteColor].CGColor];
[blackText setForegroundColor:[NSColor blackColor].CGColor];
[blackText setString:@"CATextLayer"];
[blackText setShouldRasterize:YES];
[self addSublayer:whiteBackground];
[self addSublayer: blackText];
}
return self;
这不起作用.不使用子像素消除锯齿绘制文本.
推荐指数
解决办法
查看次数
SGM 视差子像素估计 - 如何？
几周前，我实现了一个简单的块匹配立体算法，但结果很糟糕。所以我在互联网上搜索以找到更好的算法。在那里我找到了半全局匹配 (SGM)，由 Heiko Hirschmueller 出版。它获得了与处理时间相关的最佳结果之一。
我已经实现了该算法并获得了非常好的结果（与简单的块匹配相比），正如您在此处看到的：
我使用计算出的视差值将 2D 点重新投影到 3D，结果如下
在 SGM 结束时，我有一个数组，其中包含每个像素的汇总成本。视差相当于成本值最低的指标。
问题是，搜索最小值只会返回离散值。这导致点云中的单独层。换句话说：圆形表面被切割成许多层（见点云）。
Heiko 在他的论文中提到，通过将多项式函数拟合到成本数组中并将最低点作为视差，可以很容易地获得亚像素精度。
该问题不限于立体视觉，因此换句话说，任务如下：
- given：值数组，表示多项式函数。
- 想要：多项式函数的最低点。
我不知道该怎么做。我需要一个快速算法，因为我必须为图像中的每个像素运行此代码
例如：500x500 像素，每个成本 60-200 => 算法必须运行 15000000-50000000 次！！）。
我不需要实时解决方案！我当前的 SGM 实现（L2R 和 R2L 匹配，还没有 cuda 或多线程）需要大约 20 秒来处理 500x500 像素的图像；）。
我不要求图书馆！我尝试实现我自己的独立计算机视觉库 :)。
感谢您的帮助！
亲切的问候，安德烈亚斯
推荐指数
解决办法
查看次数
Canvas上绘制的文本的抗锯齿效果差
我在Canvas上绘制文字,并对抗锯齿的质量感到失望.据我所知,浏览器不会对Canvas上的文本进行亚像素消除.
这准确吗？
这在iPhone和Android上尤为明显,其中生成的文本不像其他DOM元素呈现的文本那样清晰.
有关高质量文本的任何建议都放在Canvas上吗？
茹贝尔
推荐指数
解决办法
查看次数
iPad上的字体子像素渲染
ClearType等子像素字体渲染可显着提高字体显示分辨率并提高屏幕可读性.如何编写字体的子像素渲染(通常),以及如何在iPad(iOS设备上的C,C++或Objective-C)上实现这一点？iPad上某些尺寸的字体非常模糊,我知道iPad的显示效果会很好......
那么,我将如何开发iPad的字体渲染引擎(例如,我如何访问子像素？我是否使用OpenGL？是否存在用C,C++或Objective-C编写的现有开源字体渲染引擎Mac OS X？)？
推荐指数
解决办法
查看次数
使用Graphics2D使用亚像素级精度绘制图像
我目前正试图以正常速度在屏幕上绘制图像,就像在视频游戏中一样.
不幸的是,由于图像移动的速率,一些帧是相同的,因为图像尚未移动整个像素.
有没有办法为floatGraphics2D 提供值,以便在屏幕上绘制图像而不是int值？
最初这是我做的:
BufferedImage srcImage = sprite.getImage ( );
Position imagePosition = ... ; //Defined elsewhere
g.drawImage ( srcImage, (int) imagePosition.getX(), (int) imagePosition.getY() );
这当然是阈值,因此图片不会在像素之间移动,而是从一个跳到下一个.
下一个方法是将绘制颜色设置为纹理,然后在指定位置绘制.不幸的是,这产生了不正确的结果,显示出平铺而不是正确的抗锯齿.
g.setRenderingHint ( RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON );
BufferedImage srcImage = sprite.getImage ( );
g.setPaint ( new TexturePaint ( srcImage, new Rectangle2D.Float ( 0, 0, srcImage.getWidth ( ), srcImage.getHeight ( ) ) ) );
AffineTransform xform = new AffineTransform ( );
xform.setToIdentity ( );
xform.translate ( onScreenPos.getX ( ), onScreenPos.getY ( …推荐指数
解决办法
查看次数
find4QuadCornerSubpix 与cornerSubPix
我无法找到有关 find4QuadCornerSubpix() 函数的任何类型的信息。我试图了解 find4QuadCornerSubpix() 和 cornerSubPix() 之间的区别。
有人可以帮助我吗？
谢谢
推荐指数
解决办法
查看次数
浏览器何时将像素分数四舍五入为完整像素，什么时候不？
我记得在SO上读过，CSS中一般应避免像素分数，因为浏览器倾向于将其舍入为完整像素。
实际上，以下示例显示了0.3像素如何舍入为完整像素：
span {
border: 0.3px solid black;
}<span>Lorem ipsum.</span>我很惊讶，因为我似乎找到了一个反例：
span {
color: white;
-webkit-text-stroke: 0.3px black;
}<span>Lorem ipsum.</span>与1px：
span {
color: white;
-webkit-text-stroke: 1px black;
}<span>Lorem ipsum.</span>我不是在抱怨的是它发生，相反它几乎是一个救星我，但我想知道为什么它会发生。
- 浏览器何时将像素分数四舍五入为完整像素？什么时候不呢？这里有什么规则？
- 我可以依靠浏览器不四舍五入
0.3px到1px在上面的例子？这种行为在浏览器之间是否一致？还是依靠这种行为来解决麻烦？ - 这怎么发生？在笔记本电脑上，像素（像素）应该不受硬件（显示器）限制的约束吗？
推荐指数
解决办法
查看次数
Web-Kit和子像素值,解决方法？
我注意到像Chrome和Safari(Windows)这样的Web-kit浏览器倾向于将em值舍入到最近的像素,而Firefox,IE,？歌剧？可以使用子像素值.这通常不是一个大问题,但是当我使用em来精确对齐字母间距或使用文本阴影在不同的客户端分辨率中获得一致的效果时,这会让我头疼.看看下面的测试用例.
您将看到在FF中,即使最小的字母仍然有阴影,而Chrome将em值向下舍入为零,前两个段落没有阴影.
编辑这不是关于单位.如果用0.9,0.8,0.7替换0.03em,px FF将显示越来越小的阴影,而当Chrome低于1px时,它突然显示什么.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html lang="bg" xml:lang="bg" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style type="text/css">body {font-size: 18px;} p {color: cyan; text-shadow: -0.03em -0.03em 0 rgb(0, 0, 0);}</style>
</head>
<body>
<p style="font-size:1em">No Shadow Test</p>
<p style="font-size:1.5em">No Shadow Test</p>
<p style="font-size:2em">Test</p>
<p style="font-size:2.5em">Test</p>
<p style="font-size:3em">Test</p>
<p style="font-size:3.5em">Test</p>
<p style="font-size:4em">Test</p>
<p style="font-size:4.5em">Test</p>
<p style="font-size:5em">Test</p>
</body>
</html>
推荐指数
解决办法
查看次数
标签 统计
subpixel ×10
css ×3
antialiasing ×2
algorithm ×1
border ×1
canvas ×1
cleartype ×1
fluid ×1
fonts ×1
graphics ×1
graphics2d ×1
html ×1
html5 ×1
image ×1
ipad ×1
java ×1
javascript ×1
macos ×1
matching ×1
objective-c ×1
opencv ×1
pixel ×1
rendering ×1
rounding ×1
typography ×1