Тексты выглядят испорченными, когда я сужаю холст в pixijs - PullRequest
0 голосов
/ 07 ноября 2019

У меня есть тонкий текст с именем шрифта futurastd-light, когда я изменяю размер холста, текст выглядит неработающим.

Я пытался с некоторыми решениями переполнения стека следующим образом. 1. Имея больший размер текста и малое масштабирование и изменение размера. 2. Я попытался добавить разрешение холста как 1 и 2, что рекомендует документ Pixijs. Ничего не сработало.

Я уменьшаю холст, используя window.innerWidth и window.innerHeight

    ratio = Math.round(($(window).width() / $(window).height())*100)/100
    var rw = canvasWidth;
    var rh = canvasHeight;  
    var w = window.innerWidth;
    var h = window.innerHeight;
    multiplier = Math.min((h / rh), (w / rw));
    var destW = rw * multiplier;
    var destH = rh * multiplier;


    app.renderer.view.style.width = destW + 'px';
    app.renderer.view.style.height = destH + 'px';
    app.renderer.view.style.position = 'absolute';
    app.renderer.view.style.top = "50%"     
    app.renderer.view.style.left = "50%"        
    app.renderer.view.style.transform = "translate(-50%, -50%)"


    var bottom_rw = canvasWidth_bottom;
    var bottom_rh = canvasHeight_bottom;

    var bottom_multiplier = Math.min((h / bottom_rh), (w / bottom_rw));
    var bottom_destW = bottom_rw * multiplier;
    var bottom_destH = bottom_rh * multiplier;

    app_bottom.renderer.view.style.width = bottom_destW + 'px';
    app_bottom.renderer.view.style.height = bottom_destH + 'px';
    app_bottom.renderer.view.style.position = 'absolute';
    app_bottom.renderer.view.style.top = "100%"     
    app_bottom.renderer.view.style.left = "50%"     
    app_bottom.renderer.view.style.transform = "translate(-50%, -100%)" 
...