fail to render pano with single 2:1 image in android browser such as google chome

  • Dear supporters
    Currently, we encounter an issue to render the panorama with single image.
    For some special conditions, we would render the pano with single image with the below xml config:
    <preview url=""/>
    <image hfov="360.00" vfov="180.000000" voffset="0.00">
    <sphere url="/uimg/scimg/sc43151225093955/pano/R0011873_20161203115554.JPG" />
    </image>


    This works well for pc browser, and ios browser.
    But would be show abnormal result for some android browsers, for my example, i use HTC m8 google chrome.
    Below are the partial views of pano for 3 devices, M8, Asus and iphone5
    As the images, I could see the the discontinuous connection for HTC chrome.
    All of them have the same config xml file as below.
    I would like to know if there's any cause that makes this pano fail to render?

    ----------------------
    <krpano onstart="startup();" showerrors="false">


    <contextmenu fullscreen="true" versioninfo="false">

    <item name="eyehouse" caption="eyehouse" enabled="true" separate="true" onclick="openurl('http://www.eyehouse.co')"/>
    </contextmenu>
    <action name="startup">loadscene("sc43151225093955", null, MERGE);</action>
    <include url="/pano_files/plugins/webvr.xml"/>
    <plugin name="WebVR" mobilevr_fake_support="true"/>
    <textstyle name="TEXTSTYLE" font="Arial" fontsize="18" bold="true" background="false" border="false" textcolor="0xFFFFFF"effect="glow(0x000000);" textalign="center"/>


    <scene name="sc43151225093935" scenetitle="Scene 1" thumburl="" nowpic="" id="8724" onstart="pano_loaded_scene(sc43151225093935)">

    <view hlookat="0" vlookat="0" fov="90" maxpixelzoom="1.0" fovmax="150" limitview="auto"/>
    <preview url=""/>


    <image hfov="360.00" vfov="180.000000" voffset="0.00">

    <sphere url="/uimg/scimg/sc43151225093935/pano/Eyehouse_20161203_113356.jpg"/>
    </image>
    </scene>


    <scene name="sc43151225093955" scenetitle="Scene 2" thumburl="" nowpic="" id="8725" onstart="pano_loaded_scene(sc43151225093955)">

    <view hlookat="0" vlookat="0" fov="90" maxpixelzoom="1.0" fovmax="150" limitview="auto"/>
    <preview url=""/>


    <image hfov="360.00" vfov="180.000000" voffset="0.00">

    <sphere url="/uimg/scimg/sc43151225093955/pano/R0011873_20161203115554.JPG"/>
    </image>
    </scene>
    <action name="pano_loaded_scene">js(PanoInterface.loaded_scene(%1, get(pano_id)));</action>
    <control mousetype="drag2d" touchtype="drag2d"/>
    <action name="check_action">trace('check_action_log');</action>


    <action name="animate_scene_hotspot_forward">

    <!-- %1 hotspot.id, %2 callback -->tween(hotspot[%1].scale,0.25,0.5); tween(hotspot[%1].oy,-20,0.5); tween(hotspot[%1].alpha,0,0.5); looktohotspot(%1); js(%2);
    </action>
    <autorotate enabled="false" waittime="1.0" speed="3.0" horizon="0.0" tofov="120.0"/>


    <action name="add_scene_hotspot">
    set(hs_name, "%1"); set(newMarkAth,%2); set(newMarkAtv,%3); set(hotspot_url,%4); set(hotspot_width,%5); set(hotspot_height, %6); set(hotspot_animation, %7); addhotspot(get(hs_name)); set(hotspot[get(hs_name)].ath, get(newMarkAth)); set(hotspot[get(hs_name)].atv, get(newMarkAtv)); set(hotspot[get(hs_name)].onhover, onhover_hotspot(%1)); set(hotspot[get(hs_name)].onover, onover_hotspot(%1)); set(hotspot[get(hs_name)].onout, onout_hotspot(%1)); set(hotspot[get(hs_name)].onclick, click_hotspot(%1)); set(hotspot[get(hs_name)].edge, "center"); set(hotspot[get(hs_name)].width, get(hotspot_width)); set(hotspot[get(hs_name)].height, get(hotspot_height)); set(hotspot[get(hs_name)].depth, 8000); if(get(hotspot_animation), hotspot[get(hs_name)].loadstyle("vsanimate"), set(hotspot[get(hs_name)].url, get(hotspot_url))); if(is_mobile, set(hotspot[get(hs_name)].distorted, true), set(hotspot[get(hs_name)].distorted, false));
    </action>


    <action name="add_info_hotspot">
    set(hs_name, "%1"); set(newMarkAth,%2); set(newMarkAtv,%3); set(hotspot_url,%4); set(hotspot_width,%5); set(hotspot_height,%6); addhotspot(get(hs_name)); set(hotspot[get(hs_name)].ath, get(newMarkAth)); set(hotspot[get(hs_name)].atv, get(newMarkAtv)); set(hotspot[get(hs_name)].width, get(hotspot_width)); set(hotspot[get(hs_name)].height, get(hotspot_height)); set(hotspot[get(hs_name)].onhover, onhover_hotspot(%1)); set(hotspot[get(hs_name)].onover, onover_hotspot(%1)); set(hotspot[get(hs_name)].onout, onout_hotspot(%1)); set(hotspot[get(hs_name)].onclick, click_hotspot(%1)); set(hotspot[get(hs_name)].edge, "center"); set(hotspot[get(hs_name)].url, get(hotspot_url)); set(hotspot[get(hs_name)].depth, '8000'); if(is_mobile, set(hotspot[get(hs_name)].distorted, true), set(hotspot[get(hs_name)].distorted, false));
    </action>


    <action name="add_game_hotspot">
    set(hs_name, "%1"); set(newMarkAth,%2); set(newMarkAtv,%3); set(hotspot_width,%5); addhotspot(get(hs_name)); set(hotspot[get(hs_name)].ath, get(newMarkAth)); set(hotspot[get(hs_name)].atv, get(newMarkAtv)); set(hotspot[get(hs_name)].width, get(hotspot_width)); set(hotspot[get(hs_name)].height, get(hotspot_width)); set(hotspot[get(hs_name)].onhover, onhover_hotspot(%1)); set(hotspot[get(hs_name)].onover, onover_hotspot(%1)); set(hotspot[get(hs_name)].onout, onout_hotspot(%1)); set(hotspot[get(hs_name)].onclick, click_hotspot(%1)); set(hotspot[get(hs_name)].edge, "center"); set(hotspot[get(hs_name)].depth, '8000'); hotspot[get(hs_name)].loadstyle("whirlingcoin");
    </action>
    <action name="remove_hotspot">set(hs_name, "%1"); removehotspot(get(hs_name));</action>


    <action name="onhover_hotspot">
    set(hotspot_h, get(hotspot[q_%1].ath)); set(hotspot_v, get(hotspot[q_%1].atv)); spheretoscreen(hotspot_h, hotspot_v, mouse_x, mouse_y); js(PanoInterface.on_hover_hotspot(%1, get(mouse_x), get(mouse_y), get(pano_id)));
    </action>


    <action name="onover_hotspot">
    set(hotspot_h, get(hotspot[q_%1].ath)); set(hotspot_v, get(hotspot[q_%1].atv)); spheretoscreen(hotspot_h, hotspot_v, mouse_x, mouse_y); js(PanoInterface.on_over_hotspot(%1, get(mouse_x), get(mouse_y), get(pano_id)));
    </action>


    <action name="onout_hotspot">
    js(PanoInterface.on_out_hotspot(%1), get(pano_id));
    </action>


    <action name="click_hotspot">
    set(hotspot_h, get(hotspot[q_%1].ath)); set(hotspot_v, get(hotspot[q_%1].atv)); spheretoscreen(hotspot_h, hotspot_v, mouse_x, mouse_y); js(PanoInterface.on_click_hotspot(%1, get(mouse_x), get(mouse_y), get(pano_id)));
    </action>
    <style name="vsanimate" url="/icon/pv_hspot_green.png" keep="false" zorder="99" align="center" framewidth="80" frameheight="80" frame="0"lastframe="6" onloaded="vs_animate();"/>
    <style name="whirlingcoin" url="/images/icon/whirling_coin.png" keep="false" zorder="99" align="center" framewidth="85" frameheight="85"frame="0" lastframe="7" onloaded="vs_animate();"/>


    <action name="vs_animate">
    inc(frame,1,get(lastframe),0); mul(ypos,frame,frameheight); txtadd(crop,'0|',get(ypos),'|',get(framewidth),'|',get(frameheight)); delayedcall(0.1, if(loaded, vs_animate() ) );
    </action>
    <events onviewchange="on_view_change()"/>
    <events onidle="on_idle()"/>
    <events onmousedown="js(PanoInterface.on_mouse_down(get(pano_id)))"/>
    <events onmouseup="js(PanoInterface.on_mouse_up(get(pano_id)))"/>
    <events onclick="on_click_pano"/>


    <action name="on_view_change">
    js(PanoInterface.on_view_change(get(view.hlookat), get(view.vlookat), get(view.fov), get(pano_id)));
    </action>


    <action name="on_idle">
    js(PanoInterface.on_idle(get(view.hlookat), get(view.vlookat), get(view.fov), get(pano_id)));
    </action>


    <action name="on_click_pano">
    screentosphere(mouse.x,mouse.y,ath,atv); js(PanoInterface.on_click_pano(get(ath), get(atv), get(pano_id)));
    </action>
    <style name="skin_hotspotstyle" url="/pano_files/vtourskin_hotspot.png" scale="0.5" edge="top" oy="0" distorted="true"oncheck="if(skin_settings.tooltips_hotspots, if(linkedscene, showtext(get(scene[get(linkedscene)].title),SKIN_TOOLTIPS)) );"/></krpano>

Jetzt mitmachen!

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