Krpano学习:认识全景生成.bat文件及其相关配置文件(二) 以热点和导航图tooltip为例

根据我在Krpano学习:认识全景生成.bat文件及其相关配置文件(一)里介绍的,当配置文件设置不一样,生成的全景文件不一样。

 同样以MAKE VTOUR (NORMAL) droplet.bat为例,它引用的配置文件为vtour-normal.config,这个配置文件又引用了basicsettings.config和vtourskin119.skin这两个配置文件,这两个配置文件又引用了一系列配置文件。当我们通过修改这些配置文件里的设置,就可以更改生成的全景配置。

以下举几个例子:

1.把功能加到配置里,让生成的所有全景都有这个功能。

(1) 以拖动热点为例:以下的为拖动热点的方法,将之放到\templates\xml文件夹下的vtour.xml中,具体位置为startup这个action后面。这个时候用MAKE VTOUR (NORMAL) droplet.bat生成全景,会发现所有全景的xml都有拖动函数了,只要热点调用这个函数就可以实现拖动。


<action name="draghotspot">
        spheretoscreen(ath, atv, hotspotcenterx, hotspotcentery, 'l');
        sub(drag_adjustx, mouse.stagex, hotspotcenterx);
        sub(drag_adjusty, mouse.stagey, hotspotcentery);
        asyncloop(pressed,
        sub(dx, mouse.stagex, drag_adjustx);
        sub(dy, mouse.stagey, drag_adjusty);
        screentosphere(dx, dy, ath, atv);
        roundval(ath, 3);
        roundval(atv, 3);
        js(getHotSpotXY(get(ath),get(atv)));
        );
    </action>

    <action name="do_crop_animation">
        <!-- 为热点注册属性 -->
        registerattribute(xframes, calc((imagewidth / %1) BOR 0));
        registerattribute(yframes, calc((imageheight / %2) BOR 0));
        registerattribute(frames, calc(xframes * yframes));
        registerattribute(frame, 0);

        set(crop, '0|0|%1|%2');

        setinterval(calc('crop_anim_' + name), calc(1.0 / %3),
        if(loaded,
        inc(frame);
        if(frame GE frames, if(onlastframe !== null, onlastframe() ); set(frame,0); );
        mod(xpos, frame, xframes);
        div(ypos, frame, xframes);
        Math.floor(ypos);
        mul(xpos, %1);
        mul(ypos, %2);
        calc(crop, xpos + '|' + ypos + '|%1|%2');
        ,
        clearinterval(calc('crop_anim_' + name));
        );
        );
    </action>

(2) 给热点添加浮现的title为例:由上面的动图可以看到,当鼠标放到热点上时会出现热点的名称,当鼠标移走后名称消失。krpano在配置文件里提供了一个配置属性为tooltips_hotspots,但更改这个值热点并没有任何改变。但是官方提供的软件里附带的示例文件里有这个例子。路径为\viewer\examples\tooltips,运行index.html就可以看到效果。在xml中可以看到它其实是一个layer,滑入和滑出由style来控制layer的显示与否,然后给要有此功能的热点添加这个style,并为这个style的html赋值。主要代码为:

<style name="tooltip"
       onover="copy(layer[tooltip].html, tooltip);
	       set(layer[tooltip].visible, true);
	       tween(layer[tooltip].alpha, 1.0, 0.5);
	       asyncloop(hovering, copy(layer[tooltip].x,mouse.stagex); copy(layer[tooltip].y,mouse.stagey); );"
       onout="tween(layer[tooltip].alpha, 0.0, 0.25, default, set(layer[tooltip].visible,false), copy(layer[tooltip].x,mouse.stagex); copy(layer[tooltip].y,mouse.stagey); );"
       />


<!-- the 'tooltip' textfield -->
<layer name="tooltip" keep="true"
       url="%SWFPATH%/plugins/textfield.swf"
       parent="STAGE"
       visible="false" alpha="0"
       enabled="false"
       align="lefttop"
       edge="bottom"
       oy="-2"
       background="false" backgroundcolor="0xFFFFFF" backgroundalpha="1.0"
       border="false" bordercolor="0x000000" borderalpha="1.0"
       borderwidth="1.0" roundedge="0"
       shadow="0.0" shadowrange="4.0" shadowangle="45" shadowcolor="0x000000" shadowalpha="1.0"
       textshadow="1" textshadowrange="6.0" textshadowangle="90" textshadowcolor="0x000000" textshadowalpha="1.0"
       css="text-align:center; color:#FFFFFF; font-family:Arial; font-weight:bold; font-size:14px;"
       html=""
       />

在xml中给热点添加这一功能的方法:

<!-- 给热点添加一个tooltip的属性,再设置显示的内容为content。
     也就是给热点添加一个图层,这个图层显示的内容为content,这个内容是赋值给tooltip这个layer的html的。 -->
<hotspot name="spot1" url="picture.png" distorted="true" style="tooltip" tooltip="content" ath="0" atv="0" />

当热点是由javascript操控时,设置style属性时不能直接使用我们常使用的设置属性的set(name,value)方法:

krpano_hotspot.call("set(hotspot[" + hotspot_name + "].distorted,true);");
而要用loadstyle方法:

krpano_hotspot.call("hotspot[" + hotspot_name + "].loadstyle(tooltip);");
krpano_hotspot.call("set(hotspot[" + hotspot_name + "].tooltip," + hotspot_tooltip +");");

2.更改一些属性设置

 以给缩略导航图增加名称为例。需求功能为:当鼠标放到全景下方缩略图上时,鼠标旁会出现这个场景的名称,当移走后名称消失。


krpano自带这个功能,但是设置为false,需要我们自己改为true。

 (1)更改特定的全景:直接更改这个全景的xml文件内容。在xml的28行:tooltips_thumbs="false",直接将false改为true。

 (2)更改配置文件,所有全景都有这个功能。tooltips_thumbs这个属性来自于skin_settings这个结点,它是根据\templates\xml下的vtour.xml文件生成的,而这个文件其实是来源于\templates\xml\skin下的vtourskin.xml。vtourskin.xml对全景配置做了定义并赋初值,而vtour.xml对这些变量进行更改,他们的tooltips_thumbs都默认为false。因而,如果你修改了vtourskin.xml而不修改vtour.xml,那么你生成的全景里tooltips_thumbs依旧为false。你需要更改的主要是vtour.xml中的tooltips_thumbs。

  • 2
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值