krpano学习笔记，端口修改，krpano二次开发文档，krpano三维div信息展示,krpano热点显示文字

一、修改krpano端口

.\tour_testingserver -port=8085 ，修改端口，指定启动时的端口

二、给krpano添加div展示信息

和场景一起转动，不是layer，layer是固定的，没啥用。

主要是onloaded=里面的1个方法。

<action name="add_all_the_time_tooltip_info">txtadd(tooltipname, 'tooltip_', get(name));addplugin(get(tooltipname));txtadd(plugin[get(tooltipname)].parent, 'hotspot[', get(name), ']');set(plugin[get(tooltipname)].url,'%SWFPATH%/plugins/textfield.swf');set(plugin[get(tooltipname)].align,top);set(plugin[get(tooltipname)].edge,bottom);set(plugin[get(tooltipname)].x,0);set(plugin[get(tooltipname)].y,0);set(plugin[get(tooltipname)].autowidth,true);set(plugin[get(tooltipname)].autoheight,true);set(plugin[get(tooltipname)].vcenter,true);set(plugin[get(tooltipname)].background,true);set(plugin[get(tooltipname)].backgroundcolor,0x000000);set(plugin[get(tooltipname)].roundedge,5);set(plugin[get(tooltipname)].backgroundalpha,0.65);set(plugin[get(tooltipname)].padding,5);set(plugin[get(tooltipname)].border,false);set(plugin[get(tooltipname)].glow,0);set(plugin[get(tooltipname)].glowcolor,0xFFFFFF);set(plugin[get(tooltipname)].css,'text-align:center; color:#FFFFFF; font-family:MicrosoftYahei;  font-size:30px;');if(device.mobile,set(plugin[get(tooltipname)].css,'text-align:center; color:#FFFFFF; font-family:MicrosoftYahei; font-weight:bold; font-size:30px;'););set(plugin[get(tooltipname)].textshadow,0);set(plugin[get(tooltipname)].textshadowrange,6.0);set(plugin[get(tooltipname)].textshadowangle,90);if(text == '' OR text === null,copy(plugin[get(tooltipname)].html,scene[get(linkedscene)].title),copy(plugin[get(tooltipname)].html,text));set(plugin[get(tooltipname)].enabled,false);set(plugin[get(tooltipname)].html,'<div class="divt"><table><tr><div class='titlediv'>1</div></tr><tr><td>1:</td> <td>1</td> </tr><tr><td>1:</td> <td>1</td> </tr><tr><td>1:</td> <td>1</td> </tr><tr><td>1:</td> <td>1</td> </tr></table></div>');set(plugin[get(tooltipname)].vlookat,45></action>

三、krpano热点文字显示

add_all_the_time_tooltip_info 代码在上一节点。

<scene name="scene_2lowsecrit" title="" onstart="" thumburl="panos/s/thumb.jpg" lat="" lng="" alt="" heading="">....<hotspot name="spot1619696682" style="skin_hotspotstyle_div" ath="3.18" atv="20.579" depth="1300.0" hlookat="110"linkedscene="scene_2lowsecrit" linkedscene_hoffset="0.0" use3dtransition="true"onloaded="add_all_the_time_tooltip_info();do_crop_animation_div(64,64, 60); "/></scene>

四、其它常用操作

1.增加热点的目的只是想画一个箭头切换一下场景，打开"krpano Tools.exe"，打开软件主界面，点击左上方按钮“load xml”,载入vtour文件夹中的tour.xml文件就可以在软件中看到刚刚制作的场景了。

2.可以通过代码写入热点

<hotspot name="mytext1"type="text"zoom="true"ath="4.642" atv="24.049" edge="center"distorted="true"renderer="webgl"html="[span]DMI[/span]"css="font-family:Arial; font-size:14px; color:#fff;"vcenter="false"padding="5"wordwrap="true"bg="true"bgcolor="0x000000"bgalpha="0.6"bgborder="0"bgroundedge="0"bgshadow=""txtshadow=""mergedalpha="true"oversampling="1.0"mipmapping="false"onautosized=""onover="tween(alpha,1);tween(scale,0.9);"onout="tween(alpha,1);tween(scale,1);"onclick="action(open,container1);"/>

3.layer属性详解

<layer name="..."        定义引入的元素名称type="image"       引入元素的类型，可以为image、container、text（textfield），container为容器，可在容器内继续引入多个媒体元素url="..."          引入元素的路径（支持格式：SWF, JPG, PNG, GIF.）html=""				显示文字时的内容keep="false"       是否在跳入新场景时仍然保留显示该元素parent=""          设置父容器名称，可以直接是 plugin的name,也可以是全称：parent="layer[name]"或parent="hotspot[name]"alturl=""          #引入元素的路径（支持格式：SWF, JPG, PNG, GIF.），只在html5浏览器使用devices="all"      设置显示的设备类型（详见设备列表）visible="true"     设置插入元素是否可见enabled="true"     设置插入元素是否接受鼠标事件handcursor="true"  鼠标移动该元素上时，是否变为小手maskchildren="false"  设置是否将子控件变为蒙板，设置为TRUE后，除子控件范围显示外，子控件边框与父控件边框之间区域将不显示scalechildren="false" 设置是否子空间跟随父控件一同缩放zorder=""              插入元素的次序索引，可以是字符也可以是数字，html5输出必须是0-100整数capture="true"		只是该元素接受事件，false时子元素也可接受事件children="true"    启用当前元素的子元素来接收鼠标事件。preload="false"	预加载，在加载pano之前先加载图层/插件的url，然后执行任何操作。blendmode="normal" 混合/混合模式（ normal, layer, screen, add, subtract, difference, multiply, overlay, lighten, darken, hardlight, invert）仅flashstyle=""               调用已在文件中定义好的style的名称align=""               元素在屏幕对齐方式，lefttop, left, leftbottom, top, center, bottom, righttop, right, rightbottom （见示意图）edge=""                元素的边缘或描点层对齐方式，lefttop, left, leftbottom, top, center, bottom, righttop, right, rightbottom （见示意图）x=""                   对齐边界到对齐点的X横向距离y=""                   对齐边界到对齐点的y横向距离ox=""				偏移oy=""				偏移rotate="0.0"           插入元素显示时旋转度数width=""               插入元素的显示宽度(prop:自适应)height=""              插入元素的显示高度minwidth="0"maxwidth="0"minheight="0"maxheight="0"autowidth="false"  根据内容自适应宽度autoheight="false" 根据内容自适应高度scale="1.0"            插入元素的缩放比例pixelhittest="false"   仅flashsmoothing="true"   平滑  仅flashaccuracy="0"         精度alpha="1.0"            插入元素的不透明度autoalpha="false"   自动透明度usecontentsize="false"  满画布  仅flashscale9grid=""    定义9格网格（scale9grid="x-position|y-position|width|height|prescale*"）crop=""                定义元素坐标及宽高  crop="x-position|y-position|width|height"onovercrop=""          设置元素鼠标移到上方后的坐标及宽高ondowncrop=""          设置元素鼠标按下状态后的坐标及宽高mask=""    遮罩  仅flasheffect=""    位图效果适用于层/插件的形象     仅flashbackground=""  可以设置false 去掉背景bgcolor="0x000000"      type="container"状态下的背景颜色，非container状态下无效bgalpha="0.0"           背景不透明度bgborder="0"       （bgborder="widths color alpha"）边框bgroundedge="0"   圆角bgshadow=""     （基本：bgshadow="xoffset yoffset blur color alpha"；高级：gshadow="xoffset yoffset blur spread color alpha inset, ..."）阴影bgcapture="false"       是否捕抓在背景容器上事件（type="container"状态下生效）onover=""               鼠标在经过上方时执行动作onhover=""              鼠标停在上方时执行动作onout=""                鼠标停移出范围时时执行动作onclick=""              鼠标停点击时执行动作ondown=""               鼠标按下时执行动作onup=""                 鼠标按键松开时执行动作onloaded=""             加载元素完成后执行动作/>

4.增加热点事件

<!-- 定义一个动作 -->
<!-- 打开关闭图片 -->
<action name="open">
<!-- 这个语法的意思就是把第一个参数的visible（显示）设置为true -->
set(plugin[%1].visible,true);
tween(plugin[%1].alpha,1);
</action><action name="close">
set(plugin[%1].visible,false);
</action><hotspot name="mytext1"type="text"zoom="true"ath="4.642" atv="24.049" edge="center"distorted="true"renderer="webgl"html="[span]DMI[/span]"css="font-family:Arial; font-size:14px; color:#fff;"vcenter="false"padding="5"wordwrap="true"bg="true"bgcolor="0x000000"bgalpha="0.6"bgborder="0"bgroundedge="0"bgshadow=""txtshadow=""mergedalpha="true"oversampling="1.0"mipmapping="false"onautosized=""onover="tween(alpha,1);tween(scale,0.9);"onout="tween(alpha,1);tween(scale,1);"onclick="action(open,container1);"/><!-- 司机室右侧面板上ATP旋转开关 --><hotspot name="mytext2"type="text"zoom="true"ath="99.563" atv="34.140" edge="center"......onclick="action(open,container2);"这里声明点击的动作 其中container2 是下边图片图层的名字/><layername="container2"type="image"      定义图片图层url="图片的地址"width="100%"height="100%"maskchildren="true"visible="0"children="true"background="true" bgcapture="true" enabled="true"bgcolor="0x000000" bgalpha="0.8"onclick="action(close,get(name));"  // 点击这个图片就可以隐藏图片>

先就记这些，欢迎关注。