Aframe Three.js Javascript кэширование изображений - PullRequest
Новая
       15

Aframe Three.js Javascript кэширование изображений

1 голос
/ 27 мая 2019

Я делюсь кучей изображений между слоем React и слоем AFRAME VR.

Я предварительно загрузил изображения в объект активов (не используя диспетчер ресурсов aframe, так как эти ресурсы загружаются динамически во время выполнения)

т.е. 

    const asset = getAsset(state, assetId, thumbnail)
    const image = new Image()
    image.id = assetId
    image.src= asset.url
    document.getElementById('assets').appendChild(image)

При переключении слишком VR, я пытаюсь использовать те же ресурсы для загрузки миниатюр

т.е. 

 const thumb = document.getElementById(assetId)
 this.el.setAttribute('src', thumb.src)

Однако браузер перезагружает ресурсы.

В этом комментарии https://stackoverflow.com/a/44868733/2884250

Загрузка изображений в формате img в AFrame не сохраняет их в THREE.Cache поэтому изображение было загружено дважды. Но если вы загрузите изображение как a-asset-item это делает.

Итак, я попытался добавить файлы в THREE.Cache (я предполагаю, что в качестве src) 

 window.THREE.Cache.add(assetId, asset.url)

Как тогда в AFRAME я могу передать это изображение в объект AFRAME A-IMAGE как src?

1 Ответ

0 голосов
/ 27 мая 2019

разобрался ..

Добавить изображение в кеш с идентификатором 

 image.onload = () =>  window.THREE.Cache.add(assetId, image)

И использовать ID в качестве SRC 

this.el.setAttribute('src', '#'+assetId)
...