Javascript Girl
  1. Javascript Girl
  3. Easeljs ne montre pas le bitmap
Intereting Posts
Javascript array converti en un tableau php? Comment ouvrir et enregistrer du texte dans html dans un fichier en utilisant javascript en HTML En cliquant sur h: commandLink cause Uncaught ReferenceError: mojarra n'est pas définie Comment puis-je obtenir une connexion de concentrateur SignalR pour travailler en domaine interdisciplinaire? Erreur de syntaxe Ionic 2 lors de la compilation de TypeScript Quelle est la meilleure façon de créer des événements clés dans la toile HTML5? Quelle est la signification de la virgule dans un sélecteur jQuery Empêcher l'ajout contournable <div> sur ENTER – Chrome Comment puis-je obtenir des images dynamiquement fluides selon le rapport d'aspect de la fenêtre du navigateur? Variables statiques en JavaScript Comment savoir si un élément <video> est en cours de lecture? Comment afficher la miniature de la catégorie à l'aide de getThumbnailUrl () dans Magento Puis-je définir le type d'un objet Javascript? Comment déclencher un rechargement dans la maçonnerie angulaire? Comment supprimer des caractères UTF-8 invalides d'une chaîne JavaScript?

Easeljs ne montre pas le bitmap

Ceci est ma fonction js de chevalet, il dessine un cercle rouge et une image, mais le cercle se montre, mais l'image n'est pas. 

function Start() { var stage = new createjs.Stage("DogeCanvas"); var dog = new createjs.Bitmap("doge.jpg"); var circle = new createjs.Shape(); circle.graphics.beginFill("red").drawCircle(0, 0, 50); circle.x = 100; circle.y = 100; dog.x=100; dog.y=100; stage.addChild(circle, dog); stage.update(); }

Et c'est le fichier html 

 <!DOCTYPE html> <html> <head> <title>test</title> <script src="http://code.createjs.com/easeljs-0.7.0.min.js"></script> <script src="Doge.js"></script> </head> <body bgcolor="#C7C7C7" onload="Start();"> <canvas id="DogeCanvas" width="480" height="320"></canvas> </body> </html>

Pourquoi? Aidez-vous, semble-t-il dans le code d'autre part, cela fonctionne mais pourquoi cela ne fonctionne pas pour moi?

    L'image n'est probablement pas encore chargée.

    1. Vous pouvez ajouter un Ticker à la scène pour le mettre à jour constamment (ce que la plupart des applications font, car d'autres choses changent avec le temps)

    Exemple: 

     createjs.Ticker.on("tick", stage); // OR createjs.Ticker.addEventListener("tick", stage); // OR createjs.Ticker.on("tick", tick); function tick(event) { // Other stuff stage.update(event); }
    1. Écoutez la onload de l'image et mettez à jour la scène à nouveau

    Exemple: 

     var bmp = new createjs.Bitmap("path/to/image.jpg"); bmp.image.onload = function() { stage.update(); }
    1. Préchargez l'image avec quelque chose comme PreloadJS avant de l'attirer sur la scène. C'est une meilleure solution pour une application plus grande avec plus d'atouts.

    Exemple: 

     var queue = new createjs.LoadQueue(); queue.on("complete", function(event) { var image = queue.getResult("image"); var bmp = new createjs.Bitmap(image); // Do stuff with bitmap }); queue.loadFile({src:"path/to/img.jpg", id:"image"});