问题标签 [font-rendering]

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 投票
1 回答
1601 浏览

python-3.x - QPainter.drawText 丑陋的字体渲染

字体渲染(抗锯齿)与其他应用程序使用的不同。

http://rghost.net/53129449/image.png

我怎样才能让它看起来一样?

0 投票
1 回答
177 浏览

html - CSS - 根据用户的浏览器呈现不同大小的字体导致不同的菜单长度 - 如何解决?

正在发生以下情况(font-family:'Arial',sans-serif;):

IE:在此处输入图像描述

火狐: 在此处输入图像描述

铬合金: 在此处输入图像描述

所有浏览器的 CSS 都是相同的 - 它是这样的:

如您所见,它最初是在 Chrome 中构建的。我该如何解决这个烦人的问题

  • 每个浏览器都没有条件破解
  • 没有为每个菜单项设置固定大小

有简单的解决方案吗?

0 投票
2 回答
719 浏览

fonts - Windows Installer 丑陋字体渲染

问题仅出现在 Windows Installer 上。如何解决?

windows安装程序丑陋的字体

0 投票
1 回答
912 浏览

letter-spacing - 字母间距问题,尽管增加了字母间距,但两个字母粘在一起

我遇到了奇怪的问题。我附上了字母间距问题的屏幕截图。最初我注意到字母 Fi 没有正确渲染。所以我尝试添加字母间距,但这两个字母不想彼此分开。我从未注意到这种行为。

在屏幕截图中,我使用的是 Lato 字体,但我注意到 Open Sans 的行为相同。我尝试正确渲染的其他随机字体。该问题仅发生在 Chrome 和 Firefox 中,而 IE 正确呈现字体。

任何猜测可能导致它以及如何修复它?任何建议都会很棒。谢谢。

在此处输入图像描述

0 投票
1 回答
260 浏览

html - CSS 属性“will-change”改变字体颜色(亚像素字体渲染)

我正在使用 Bootstrap 4。但是当打开下拉组件时,字体颜色略有变化。

在寻找一些可能是问题的颜色定义(没有)之后,我发现了一些奇怪的东西:当我禁用下拉元素的transformand属性时,字体颜色会以某种方式受到影响。will-change在此处查看视频: https ://www.dropbox.com/s/xkhl4m6enwvdzcd/Video%20color%20bug.mov?dl=0

它在 Google Chrome 和 Cinema Display(视频)中最为明显。

似乎亚像素字体渲染也受到了影响:请参见此处的屏幕截图。有趣的是:字体颜色在关闭时渲染得更准确。

在 Safari 中也会出现字体渲染问题...

知道这里发生了什么吗?

(我可以发布一个代码笔,或者在视频中查看它的 ID。)

0 投票
1 回答
1040 浏览

opengl - 在 OpenGL 中使用 RGB 纹理作为 alpha 值/子像素字体渲染

目前我在亚像素模式下使用 FreeType,并将每个像素的最大颜色作为 alpha 值,使用以下片段着色器:

这适用于深色背景,但在较浅的背景上会显示边框像素(例如,当文本像素为 (1,0,0) 时)。为了使它适用于更亮的背景,我需要传递背景颜色并自己进行混合,一旦我移动到更复杂的背景,它就会开始崩溃。

有没有办法将 FreeType 中的 RGB 值用作纯色的 alpha 值(传递给着色器)?这个公式基本上,其中 b = 背景像素,t = 当前文本像素,c = 静态颜色:

我认为首先绘制其他所有内容并将该帧缓冲区传递给字体着色器会起作用,但这似乎有点矫枉过正。有没有办法在 OpenGL 混合阶段做到这一点?我尝试使用 glBlendFunc 等,但没有得到任何结果。

0 投票
2 回答
1350 浏览

java - JavaFX 字体渲染中的错误字符间距(紧缩)(在 Linux 中)

我已经开始在 JavaFX 中开发一个应用程序并且我遇到了一个问题,我几乎找不到关于以下方面的有用信息:Linux 中字符之间的间距非常不均匀。我不是在谈论不同字符的宽度,而是在谈论字符之间的空格。

它在普通文本中可见,但下面的示例比普通文本更能说明效果。看看第一行。前两个字符之间的间距小于第二个和第三个字符之间的间距。这也发生在第六个和第七个字符以及其他几个字符之间:

字符间距不均匀

Swing 没有这个问题,JavaFX 在 Windows 中没有这个问题,或者它在那个操作系统上几乎不可见。它似乎也不是 Mac 上的主要问题。为了比较,下面是 2014 年年中 Mac Retina MacBook Pro 上的示例输出,运行 OS X 10.12.6 和 Java 9.0.4:

在此处输入图像描述

有谁知道这是否是 JavaFX 字体渲染引擎中的错误?如果是这样,是否有解决方法?

我真的开始怀疑是否应该更改框架,因为在我看来,这种糟糕的字体渲染是不可接受的。

关于这个问题还有另一个问题,但尚未得到解答: 为什么 JavaFX 在使用 Text 组件时会在字母之间添加额外的间距,我该如何解决?

我已经能够在运行 Manjaro 的两台不同的 Linux 机器和运行 Debian 的虚拟机上使用以下代码重现此问题:

0 投票
1 回答
597 浏览

pdf - Coldfusion 不在 PDF 中显示已安装的字体

我在 Coldfusion 2016(64 位)的字体管理中安装了 Helvetica Neue Thin。安装没有任何错误,但字体不显示在 PDF 中。我有 Barcode 字体,它已安装并完美运行。问题是:需要字体特殊许可证才能在网页上显示它?如果是,条形码字体如何完美工作(无需任何特殊许可)。

0 投票
0 回答
171 浏览

css - 指定“等宽”通用字体时的不同字体边距

在 OSX 上的 Chrome 中用中文指定“等宽”时,它会正确渲染 PingFang SC,但是渲染的字体会比直接使用“PingFang SC”渲染完全相同的字体高 2 个像素。演示:

在此处输入图像描述 https://jsbin.com/mahuqub/edit?html,输出

这不是行高问题,因为我可以看到将行高设置为完全相同的结果。我还注意到某些问题,例如特殊字符/空格在未正确设置“lang”属性时占用不同的空间,但是通过设置“lang”而不使用特殊字符来控制此处。另请注意,Chrome 声称正在渲染 PingFang SC。我还确保我的系统上只有默认的“PingFang SC”字体,不存在其他用户安装的字体。我也没有注意到其他脚本中等宽泛型的这种行为(hrkt/hang,当然还有拉丁语等)。

我的问题是:

1)为什么“等宽”会以不同的方式呈现完全相同的字体?

2)有没有办法检测到这个?

0 投票
1 回答
525 浏览

javascript - Roboto 字体仅在 Windows Edge 中的一个 DOM 元素和 Win7 中的 IE10 上替换了默认的 Time News Roman

我使用 html、css 和 GSAP tweenies 制作了一个 svg 动画横幅。一切都很好,直到计数器开始使用简单的 innerHTML 属性进行计数。横幅中的所有文本都应该是 Roboto,除了这个元素被默认的 Times New Roman 替换。这仅在 Windows 浏览器中发生:Edge 和 IE10,所有其他供应商的浏览器都按应有的方式呈现它。

计数器的 50% 阶段

计数器的 70% 阶段

元素过渡到将混合到复制文本中的位置

您可以在最后一张图片中看到 70% 的人非常出色

CSS部分:

html部分:

js部分:

编辑:指定此问题仅在 Windows 浏览器中发生(最初的问题令人困惑)