在 Pixi.js 中计算精灵纹理的分辨率答案

【问题标题】：Calculate resolution of sprite texture in Pixi.js在 Pixi.js 中计算精灵纹理的分辨率
【发布时间】：2016-07-21 04:33:42
【问题描述】：

如何计算 PIXI.js 中生成纹理的分辨率。 generateTexture(...) 的文档需要一个数字来表示分辨率。

文档：http://pixijs.github.io/docs/PIXI.Graphics.html#generateTexture

在以下示例中，将绘制一个具有特定宽度和高度的矩形。在我看来，分辨率是宽度和高度相乘的像素数。

this._graphics.lineStyle(1, 0x012489, 1.0);
this._graphics.beginFill(0x696969, this.1.0);
this._graphics.drawRect(-(width/2.0), -(height/2.0), width, height);
this._graphics.endFill();

this.texture = this._graphics.generateTexture(width * height, PIXI.SCALE_MODES.DEFAULT);

【问题讨论】：

您的假设听起来是对的，但我现在无法确认。但是您似乎没有考虑到起始 x 和 y 坐标。大小不仅仅是宽度 * 高度，因为您不是从坐标 0、0 开始的。还要注意，由于图形是矢量，您当然可以提供您希望图像具有的任何分辨率。它不需要与图形中的完全相同，因为它会被缩放。

标签： javascript webgl pixi.js

【解决方案1】：

从代码看来，设置的分辨率不是分辨率，而是相对分辨率，实际上是：https://pixijs.github.io/docs/PIXI.BaseTexture.html#resolution，正如它所说：“不同像素比的设备的纹理分辨率”。

默认为1，桌面设备正常，移动设备像素比例可以不同。您应该能够使用此函数 (getPixelRatio)：https://github.com/Hachitus/FlaTWorld/blob/master/src/components/map/core/utils/utils.js#L195 获取像素比率，但该函数并未真正经过实战测试，但目前在测试中也没有显示任何问题。

【讨论】：