Example/Tutorial - Extract a Distorted Hotspot from any kind of Pano Image (with perfect pixel alignment)

  • nonchiedercilaparola...
    ?!?!
    In italiano please... che è che vuoi fare? A che ti serve un HS poligonale??

    scusa la mia ignoranza....in pratica se ad esempio ho oggetto non-rettangolare )(es. una chitarra) e volessi creare un hotspot ritagliato sulle forme dell'oggetto avrei la possibilità di utilizzare gli hotspot poligonali ma non sono visibili sui dispositivi mobili.

    Ad esempio se volessi evidenziare l'oggetto al passaggio del mouse sopra di esso l'unico modo da quanto ho capito è l'hotspot poligonale (estrapolare una vista via ptgui per usarla come hotspot distorted non sarebbe utile in quando l'effetto del passaggio non sarebbe preciso). Considerando però che nei dispositivi mobili non vi è il mouse ho pensato di aggiungere un alturl all'hotspot. Qundo si è su pc si prende l'hotspot poligonale, quando si è su tablet smartphone si prende l'hotspot distorted.

    In pratica volevo semplicemente sapere se vi sono modi alternativi per far questo ovvero se si può far funzionare l'hotspot poligonale anche su dispositivi mobili in quanto è una seccatura dover creare due hotspot ad oggetto quando se ne hanno tanti.

  • Hello, Mighty ALL.

    I've tested krPano and everything works perfectly, except polygonal hotspots in HTML5.
    Yes, they are not supported.
    But is there a way to convert polygonal hotspots into image's extracts and use them with this tutorial's method ?
    I have hotspot's ath,atv values... I have X,Y points of the hotspot on the original spherical image.
    There should be a way to generate image extracts per each hotspot ?!

    Thank you.

  • I'm trying to get this going on a FLAT pano. Now, this trick works perfectly fine in the Flash viewer, but not in the new HTML5 multires preview viewer (build 2013-07-30). In particular, the calc_pos_from_hfov_yaw_pitch_roll action is not placing the image correctly. It looks like the image's height and width is incorrect (the location seems right though...).


    Any idea why?

  • Hi friends!
    Maybe I missed something, but I still can not understand — нow you calculated needed size of image for distorted hotspot for embed in already panorama? When I have big original size of Equirectangular panorama and extract his in PTGui. And after krpano droplet (Normal) and other type… to the size of the image was not big and not small for loading, and had no significant difference in the resolutions in panorama.
    Example for cube strip: Desktop 2048px(normal), tablet 1024px, mobile 512px.
    Thank you for your experience and help
    *confused*

    Panoreal — to make and see this wonderful world! *whistling*

  • did you followed step by step the first post?
    "нow you calculated needed size of image for distorted hotspot for embed in already panorama? "

    equirettangolar images (360x180) --> PTGUI: extraction rectilineare images and get hfov, yaw, rol andl pitch --> insert this value into krpano function calc_pos_from_hfov_yaw_pitch_roll(hfov, yaw, pitch, rol).

  • Fun nonchiedercilaparola! )
    You not Understood me) I mean how how to choose the resolution of these images for imbedded into a panorama. 360° Panorama we can have a much lower resolution!
    And of course I read this from Klaus^
    "HTML5 / Mobile Notes:

    • For HTML5 hotspots the width or height of the hotspot image shouldn't exceed a certain size.
    • For Desktop HTML5 the size should be below 2000px to avoid rendering problems in Safari.
    • And for mobile/tablet devices the size should be even more smaller because of performance and memory limitations on these devices, e.g. keep it below 1200-1400px.
    • Define the smaller images in the xml by using the devices setting and different url values:

    "

    Thanks! *rolleyes*

    Panoreal — to make and see this wonderful world! *whistling*

  • Two questions:
    1. If I have original image of e.g. 10000px*5000px and for panorama creation I have resized it to 5000*2500 before making panorama, I should than use this smaller one as input for this tutotial, right? Otherwise it will not match in already created panorama if i use original size image?
    2. Will have one panorama with more than doesen hotspots of that kind. Wouldn't be easier for Viewer not to calculate onloaded but to calculate width, ath,ath and rotate for each hotspot in advance with code provided and simply take resluts and use them in the code when defining hotspot? No calculation needed at all in online version *unsure* . Only during creation to get exact attribute values. I'm just afraid that Krpano will be slow doing this massive calculation in my case as I already did some heavy math with and come up with very slow behaviour.

    If I missed the point, I'm just staring to try this our for the first time. In the past I did this differently and now I want to try it with one upcomming project so feel like newbe *confused* on this "extraction" process.

    EDIT AFTER TESTING:
    1. Have tested and it is fine even in that case. But you can see the difference due to the higher resolution of the hotspot. So I think best is to do it with the resolution that will be used for make pano droplets.
    2. Also tested and easiest is to first time create it with action: calc_pos_from_hfov_yaw_pitch_roll for the first time. Than I opened Editor, took xml from memory and copy/paste ATH, ATV, WIDTH and ROTATE to my code. So instead of
    onloaded="calc_pos_from_hfov_yaw_pitch_roll(17,-7.84, 0.24, -0.03);"
    now I have
    ath="7.8" atv="0.2" distorted="true" rx="0" ry="0" rz="0" width="149.451002707298" height="prop" rotate="-0.03"
    and no calculation needed anymore.

    Edited 2 times, last by Umalo (August 31, 2013 at 9:37 PM).

  • Two questions:
    1. If I have original image of e.g. 10000px*5000px and for panorama creation I have resized it to 5000*2500 before making panorama, I should than use this smaller one as input for this tutotial, right? Otherwise it will not match in already created panorama if i use original size image?

    It's same with my question, I join to this! *whistling*

    Panoreal — to make and see this wonderful world! *whistling*

  • EDIT AFTER TESTING:
    1. Have tested and it is fine even in that case. But you can see the difference due to the higher resolution of the hotspot. So I think best is to do it with the resolution that will be used for make pano droplets.
    2. Also tested and easiest is to first time create it with action: calc_pos_from_hfov_yaw_pitch_roll for the first time. Than I opened Editor, took xml from memory and copy/paste ATH, ATV, WIDTH and ROTATE to my code. So instead of
    onloaded="calc_pos_from_hfov_yaw_pitch_roll(17,-7.84, 0.24, -0.03);"
    now I have
    ath="7.8" atv="0.2" distorted="true" rx="0" ry="0" rz="0" width="149.451002707298" height="prop" rotate="-0.03"
    and no calculation needed anymore.

  • A very nice tip Umalo! It's working! But I needed a little bit to fix the parameters after the calculation, was a small shift along one axis! ;) *thumbsup*

    Panoreal — to make and see this wonderful world! *whistling*

  • scusa la mia ignoranza....in pratica se ad esempio ho oggetto non-rettangolare )(es. una chitarra) e volessi creare un hotspot ritagliato sulle forme dell'oggetto avrei la possibilità di utilizzare gli hotspot poligonali ma non sono visibili sui dispositivi mobili.

    Ad esempio se volessi evidenziare l'oggetto al passaggio del mouse sopra di esso l'unico modo da quanto ho capito è l'hotspot poligonale (estrapolare una vista via ptgui per usarla come hotspot distorted non sarebbe utile in quando l'effetto del passaggio non sarebbe preciso). Considerando però che nei dispositivi mobili non vi è il mouse ho pensato di aggiungere un alturl all'hotspot. Qundo si è su pc si prende l'hotspot poligonale, quando si è su tablet smartphone si prende l'hotspot distorted.

    In pratica volevo semplicemente sapere se vi sono modi alternativi per far questo ovvero se si può far funzionare l'hotspot poligonale anche su dispositivi mobili in quanto è una seccatura dover creare due hotspot ad oggetto quando se ne hanno tanti.

    Ok, no, puoi usare il distorted ed ATTIVARLO con l' hotspot poligonale. Ma se ti basta la manina del mouse usa solo il poligonalhotspot senza fill, border etc.

  • Quote

    Ok, no, puoi usare il distorted ed ATTIVARLO con l' hotspot poligonale. Ma se ti basta la manina del mouse usa solo il poligonalhotspot senza fill, border etc.

    Mi stai dicendo di usarli entrambi?

    quello che voglio ottenere è potere avere l'effetto poligonale al passaggio del mouse su dispositivi pc che non hanno installato flash. L'effetto che cerco non è solo quello del cambiamento del puntatore del mouse ma anche la visualizzazione del bordo e di una trasparenza.

    mi sa che ad ora nn ci sia un'alternativa non flash agli hotspot poligonali.

    about this issue? no one feels the need

    Quote

    is it possible to coincide view of a pano (hlookat, vlookat, camroll, fov) with pano rectilinear extraction (width, ath, atv, rotate get by ptgui value - hfov, vfov, yaw, pitch, roll )?


    i don't understand the target of the post. do you search a solution to have more distorted hostpost without misalignments effect when we navigate the pano?


    As this is related also to this thread I will ask for your opinions also herePlease take a look at this question related to pixelhitset with multiple distorted hotspot aligned by this tutorial

    Link to thread

    Thanks
    Umalo

Participate now!

Don’t have an account yet? Register yourself now and be a part of our community!