Используйте изображение по умолчанию для 404 с при использовании загрузчика синхронного изображения JavaScript для холста html5 - PullRequest
0 голосов
/ 28 мая 2019

Как мне добавить изображение по умолчанию (0.png) в этот загрузчик изображений вместо того, чтобы выдавать ошибку на 404?

        var artArrayDef = ['player_art/' + p_me_gen + 'body' + me_race + '.png', 'player_art/head' + me_face + '.png'];
        var artArray01  = ['item_art/' + p_me_gen + me_chest + '.png', 'player_art/hair' + me_hair + '.png', 'item_art/' + me_helm + '.png', 'item_art/' + p_me_gen + me_legs + '.png', 'item_art/' + me_feet + '.png', 'item_art/' + me_hands + '.png', 'item_art/' + me_sleeves + '.png', 'item_art/' + me_about + '.png', 'item_art/' + me_hold + '.png', 'item_art/' + me_wield + '.png'];

        // Images for humanoid body and gear
        function loadImage_char(imagePath) {
            return new Promise((resolve, reject) => {
                let image = new Image();
                image.addEventListener("load", () => {
                    resolve(image);
                });
                image.addEventListener("error", (err) => {
                    reject(err);
                });
                image.src = 'https://www.example.com/interface/images/' + imagePath;
            });
        }

        let imageSources = [].concat(artArrayDef, artArray01);
        Promise.all(imageSources.map(i => loadImage_char(i))).then((images) => {
            images.forEach((image) => {
                meCtx.drawImage(image, 0, 0);
            });
        }).catch((err) => {
            console.error(err);
        });

1 Ответ

0 голосов
/ 28 мая 2019
        var artArrayDef = ['player_art/' + p_me_gen + 'body' + me_race + '.png', 'player_art/head' + me_face + '.png'];
        var artArray01  = ['item_art/' + p_me_gen + me_chest + '.png', 'player_art/hair' + me_hair + '.png', 'item_art/' + me_helm + '.png', 'item_art/' + p_me_gen + me_legs + '.png', 'item_art/' + me_feet + '.png', 'item_art/' + me_hands + '.png', 'item_art/' + me_sleeves + '.png', 'item_art/' + me_about + '.png', 'item_art/' + me_hold + '.png', 'item_art/' + me_wield + '.png'];

        // Images for humanoid body and gear
        function loadImage_char(imagePath) {
            return new Promise((resolve, reject) => {
                let image = new Image();
                image.addEventListener("load", () => {
                    resolve(image);
                });
                image.addEventListener("error", (err) => {
                    // Add the default image here <---
                    let defaultImg = new Image();
                    defaultImg.src = 'https://www.example.com/interface/images/item_art/0.png';
                    resolve(defaultImg);
                });
                image.src = 'https://www.example.com/interface/images/' + imagePath;
            });
        }

        let imageSources = [].concat(artArrayDef, artArray01);
        Promise.all(imageSources.map(i => loadImage_char(i))).then((images) => {
            images.forEach((image) => {
                meCtx.drawImage(image, 0, 0);
            });
        }).catch((err) => {
            console.error(err);
        });
...