Pixi.js

Question

我有2个独立的项目绘制随机草地tilemap，分别使用了2种不同的方法（个人想看看哪个更convenient/efficient）。一个只使用 Canvas，另一个使用 Pixi.js。它们在 PC 上都工作正常，但是当我使用 cordova 将其编译为 Android 应用程序时，pixi.js tileset 有一个模糊

常规Canvas/Cordova

皮喜.js/Cordova

如果仔细观察，Regular Canvas中的'grass'是锐利的，但Pixi.js中的模糊了

我试过这些设置但没有用。 window.devicePixelRatio 在手机上阅读 3

PIXI.jS

PIXI.settings.autoDensity = true;
PIXI.settings.ANISOTROPIC_LEVEL = 0;
//PIXI.settings.SCALE_MODE = PIXI.SCALE_MODES.NEAREST;

let app = new PIXI.Application({
    width: screenSize.x,
    height: screenSize.y,
    antialias: true,
    autoResize: true,
    resize: (screenSize.x, screenSize.y),
    transparent: false,
    resolution: window.devicePixelRatio,
    rootRenderTarget: {
        resolution: window.devicePixelRatio
    },
    backgroundColor: 0x061639,
});

Answer 1

经过一番尝试，我发现 PIXI.settings.RESOLUTION = window.devicePixelRatio; 必须声明。现在一切都变得更清晰了

Pixi.js - 如何修复移动设备上的纹理模糊问题？

Pixi.js - How to fix texture blur on mobile?

javascript

html

cordova