ChromaKey on video layer

  • Hello,
    I’m working on a project using KRPano, and my goal is to include in bottom left of the screen a video of a man on a green screen. I have to remove this green screen, I founded the option « chroma key » on hotspots, but I found nothing for fix a hotspot to the screen and defining it specific placement.

    My solution was to use a <layer> instead of <hotspot>, but I can’t make chromakey work on layer...

    Do someone have any usable solution please ?

    Thanks,
    Navalex.

    A front-end web developer, specialized in Virtual Tours and ReactJS

    Einmal editiert, zuletzt von Navalex (25. Februar 2021 um 21:28)

  • Hi,

    Chromakey is WebGL-feature and only hotspots are rendered by WebGL, the layers are HTML/CSS elements.

    But there would be an 'indirect' possibility to place a hotspot like a layer on the screen:

    Set the 'flying' setting to '1', then hotspot will be always centered in the middle of the screen and then use the onresize event to set/calculate the ox/oy (offset position) setting to move the hotspots around on the screen.

    E.g. here code to place the hotspot like a layer in the right bottom corner:

    For other corners or offset just modify the onresize calculation slightly (changed signs, additional offsets).

    Note - the zoom or distorted settings of the hotspot would need to be set to false or to be removed.

    Best regards,
    Klaus

  • Hey,

    That approximatly what I finally done, thanks for your help.
    But I had strange behaviour, like resize only called on project startup but not on window resize.. So I put the action on event "onviewchanged" and "onnewscene" to track the more often possible the size, seems to work ^^

    I have a last question, is there a way to compute the height/width of an element with a "prop" attribute, to get it real size ? (need for calculation)

    Thanks,
    Navalex

    A front-end web developer, specialized in Virtual Tours and ReactJS

  • I want to know how we can put hotspot in rightbottom

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!