Nano Hash - криптовалюты, майнинг, программирование

Как кэшировать изображение и использовать его позже в EaselJS?

У меня очень простая анимация спрайтов. Как кэшировать изображение и использовать его в части «изображения» при создании листа спрайтов? Я пробовал с:

Image1= new Image(2779,1135)
Image1.src = "img/contur.png"

но я не знаю, как включить изображение 1 в раздел «изображения».

stage = new createjs.Stage(document.getElementById("testCanvas")); этап.очистить();

var ss = new createjs.SpriteSheet({
    "animations": {"run": [0, 50]},
    "images": ["img/contur.png"],
    "frames":
        {
        "height": 140,
        "width": 231,
        "regX": 0,
        "regY": 0,
        "count": 51
        }
    });

var grant = new createjs.Sprite(ss, "run");

stage.addChild(grant);
createjs.Ticker.setFPS(24);
createjs.Ticker.addEventListener("tick", stage);
sprite sprite-sheet easeljs css-sprites
16.10.2014

Ответы:


1

Если я правильно понял ваш вопрос, вы хотите загрузить изображение до его использования в таблице спрайтов.

У вас есть 2 способа сделать это:

  1. Добавьте обратный вызов на img.load:

    img = new Image();
img.src = "img/contur.png";
img.onload = function(event) {
    // you can create spritesheet here
}

  2. Использование PreloadJS (рекомендуется):

    loader   = new createjs.LoadQueue(true);
loader.on('complete', function(event) {
    // you can create spritesheet here
});
loader.loadManifest([{id:'imageX', src:'img/contur.png'}]);

    в этом случае вам также необходимо запустить веб-сервер (например, используя python: python -m SimpleHTTPServer 8088)

Для обоих вариантов вам просто нужно использовать путь к изображению (браузер автоматически получит предварительно загруженное изображение):

var ss = new createjs.SpriteSheet({
    "animations": {"run": [0, 50]},
    "images": ["img/contur.png"],
    "frames": {
        "height": 140,
        "width": 231,
        "regX": 0,
        "regY": 0,
        "count": 51
    }
});

Если вы используете PreloadJS, вы можете указать загруженный объект изображения по псевдониму (определенному в манифесте):

"images": [loader.getResult('imageX')],
...

ПРИМЕЧАНИЕ: не забудьте вызвать stage.update() после добавления материала на сцену или анимации кадров, иначе будет просто показан пустой холст или статичное изображение.

16.10.2014
  • Спасибо большое за Ваш ответ. Действительно, изображение загружается (когда я запускаю игру), но оно все еще остается за несколько секунд до отображения на холсте (после того, как пользователь завершил уровень). На втором готовом лвле появляется мгновенно. Нужен ли еще один кеш внутри EaselJS? 17.10.2014
  • У меня есть большой спрайт для работы на больших экранах. Как я могу уменьшить масштаб спрайта, чтобы он соответствовал области холста? 17.10.2014
    • Новые материалы
    Кластеризация: более глубокий взгляд
    Кластеризация — это метод обучения без учителя, в котором мы пытаемся найти группы в наборе данных на основе некоторых известных или неизвестных свойств, которые могут существовать. Независимо от..
    Как написать эффективное резюме
    Предложения по дизайну и макету, чтобы представить себя профессионально Вам не позвонили на собеседование после того, как вы несколько раз подали заявку на работу своей мечты? У вас может..
    Частный метод Python: улучшение инкапсуляции и безопасности
    Введение Python — универсальный и мощный язык программирования, известный своей простотой и удобством использования. Одной из ключевых особенностей, отличающих Python от других языков, является..
    Как я автоматизирую тестирование с помощью Jest
    Шутка для победы, когда дело касается автоматизации тестирования Одной очень важной частью разработки программного обеспечения является автоматизация тестирования, поскольку она создает..
    Работа с векторными символическими архитектурами, часть 4 (искусственный интеллект)
    Hyperseed: неконтролируемое обучение с векторными символическими архитектурами (arXiv) Автор: Евгений Осипов , Сачин Кахавала , Диланта Хапутантри , Тимал Кемпития , Дасвин Де Сильва ,..
    Понимание расстояния Вассерштейна: мощная метрика в машинном обучении
    В обширной области машинного обучения часто возникает необходимость сравнивать и измерять различия между распределениями вероятностей. Традиционные метрики расстояния, такие как евклидово..
    Обеспечение масштабируемости LLM: облачный анализ с помощью AWS Fargate и Copilot
    В динамичной области искусственного интеллекта все большее распространение получают модели больших языков (LLM). Они жизненно важны для различных приложений, таких как интеллектуальные..