说明:根据一定数量的某个物体的各位面图生成360°旋转物体,使用krpano 设置layer 自动旋转或使用鼠标转动。
图片数量大概35~70 张。本示例为35张图
生成之前的xml代码(使用thinkphp):
解释:
$row 为物体的信息,类似下面这些信息:
效果:
array(10) {
["id"]=> string(2) "11" 物体id
["member_id"]=> string(1) "1"
["pano_id"]=> string(2) "67" 场景ID
["title"]=> string(12) "暂无名称"
["file"]=> string(52) 图片路径 "/uploads/user/238a0b923820dcc/67/cube/cube1497234090"
["width"]=> string(3) "750" 图片宽
["height"]=> string(3) "450" 图片高
["imagetype"]=> string(1) "2" 图片类型
["len"]=> string(2) "35" 图片数量
["is_ok"]=> string(1) "0" 是否可用
}
$cube_id 为旋转物体ID(只是保证此旋转物体的name唯一,使用随机数也可以,但要保证唯一)
<?xml version="1.0" encoding="UTF-8"?>
<krpano>
<skin_settings cube{
$cube_id}_id="1" cube{
$cube_id}_total="{
$row['len']}" cube{
$cube_id}_autogo="{
$cuberow['is_auto']}"
cube{
$cube_id}_speed="0" cube{
$cube_id}_go="0" cube{
$cube_id}_dir="-1"
cube{
$cube_id}_mx="0" cube{
$cube_id}_my="0" cube{
$cube_id}_fd="{
$fd}" cube{
$cube_id}_sp="{
$speed}"
/>
<events onresize="action(setcube{
$cube_id}wh);" />
<layer name="cube{
$cube_id}" visible="False" enabled="True" keep="false" type="container" bgcolor="0xffffff" bgalpha="0.5" align="center" width="100%" height="100%" x="0" y="0" zorder="1000">
<layer name="infotext" url="__PUBLIC__/pano/plugins/textfield.swf" enabled="true" border="false" background="false" zorder="1003"
align="righttop" x="10" y="10" width="80" autoheight="true" onclick="set(layer[cube{
$cube_id}].visible,false);"
css="text-align:center; color:#FF0000; font-family:微软雅黑; font-weight:bold; font-size:14px;"
html="点击关闭"
/>
<layer name="cube{
$cube_id}_eventpage" url="__PUBLIC__/member/images/common/none.png" ondown="cube{
$cube_id}start();" onup="cube{
$cube_id}stop();" visible="True" keep="false" align="center" edge="center" width="100%" height="100%" x="0" y="0" zorder="1002"></layer>
<layer name="cube{
$cube_id}_photoshow" keep="false" type="container" bgcolor="0x000000" bgalpha="0" scalechildren="true" align="center" width="{
$row['width']}" height="{
$row['height']}" x="0" y="0" zorder="1001">
<for start="0" end="$row['len']">
<if condition="$i eq 0">
<layer name="cube{
$cube_id}_img{
$i+1}" visible="True" handcursor="False" url="{:CC('web_root')}{
$row['file']}/cube{
$i}.{
$end[$row['imagetype']]}" align="center" edge="center" width="{
$row['width']}" height="{
$row['height']}" x="0" y="0"/>
<else/>
<layer name="cube{
$cube_id}_img{
$i+1}" visible="false" handcursor="False" url="{:CC('web_root')}{
$row['file']}/cube{
$i}.{
$end[$row['imagetype']]}" align="center" edge="center" width="{
$row['width']}" height="{
$row['height']}" x="0" y="0"/>
</if>
</for>
</layer>
</layer>
<!--設置寬高-->
<action name="setcube{
$cube_id}wh">
set(winw,get(stagewidth));
set(winh,get(stageheight));
div(wxp,winw,{
$row['width']});
div(whp,winh,{
$row['height']});
if(wxp GT whp,
if(winh LT {
$row['height']},set(layer[cube{
$cube_id}_photoshow].scale,get(whp)););
,
if(winw LT {
$row['width']},set(layer[cube{
$cube_id}_photoshow].scale,get(wxp)););
);
</action>
<!--點擊播放-->
<action name="cube{
$cube_id}start">
set(skin_settings.cube{
$cube_id}_go,1);
set(skin_settings.cube{
$cube_id}_speed,0);
set(skin_settings.cube{
$cube_id}_mx,get(mouse.stagex));
set(skin_settings.cube{
$cube_id}_my,get(mouse.stagey));
action("cube{
$cube_id}doing");
action("cube{