Pannellum: [ask] Update canvas image

Created on 28 Oct 2020  路  6Comments  路  Source: mpetroff/pannellum

Has a way to update a canvas image from new Image() with out pass by Viewer.loadScene()?

Im trying a way to put hotspot on inside the scene, like a key on the floor
ScreenShot_20201028094208

Im tring merge images https://github.com/lukechilds/merge-images
But, how to put the result on canvas? like dynamic video

question

Most helpful comment

All 6 comments

i found a way https://codepen.io/dwuster2/pen/GRqdMLE
external canvas render with pixi.js
ScreenShot_20201102170508

I'm glad it works for you, but it's unusably slow for me. I get ~2 fps on your demo, and it manages to lock up my browser in both Firefox and Chrome.

As you're already using a custom hot spot, why don't you just use CSS to make the hot spot itself the key?

custom hotspots dont have the scene deformation
then i draw a bg on canvas and the key, when hotspots is clicked, i update the canvas...
trying to make it dynamic

has other way to make hotspot inside the scene?

its low fps because im testing 2k resolusion canvas and maybe i need to use .setUpdate(false)

i changed pixijs for phasejs, looks better

Using a canvas like you're doing is what I'd recommend if you need perspective distortion on the hot spot.

The performance is much better now. I'd still recommend calling viewer.setUpdate(false), since this will save CPU / GPU cycles (and thus give better battery life) by stopping the rendering when the user isn't moving the viewer.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

valeriodeluca picture valeriodeluca  路  3Comments

littlee picture littlee  路  8Comments

mikeMikeymike picture mikeMikeymike  路  8Comments

fuzzybabybunny picture fuzzybabybunny  路  7Comments

shtrudelsupport picture shtrudelsupport  路  3Comments