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）仅flash style="" 调用已在文件中定义好的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" 仅flash smoothing="true" 平滑 仅flash accuracy="0" 精度 alpha="1.0" 插入元素的不透明度 autoalpha="false" 自动透明度 usecontentsize="false" 满画布 仅flash scale9grid="" 定义9格网格（scale9grid="x-position|y-position|width|height|prescale*"） crop="" 定义元素坐标及宽高 crop="x-position|y-position|width|height" onovercrop="" 设置元素鼠标移到上方后的坐标及宽高 ondowncrop="" 设置元素鼠标按下状态后的坐标及宽高 mask="" 遮罩 仅flash effect="" 位图效果适用于层/插件的形象 仅flash background="" 可以设置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 是下边图片图层的名字 /> <layer name="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));" // 点击这个图片就可以隐藏图片 >

先就记这些，欢迎关注。