更新于 2020.11.19 krpano 1.20.9
官方下载包路径
你电脑的路径\krpano-1.20.9\viewer\examples\custom-contextmenu
提示:如果不明白下载包路径是什么,请查看 循序渐进(3)- krpano下载包的使用说明
在线演示(单击右键测试)
如何完全屏蔽右键菜单,请查看:教程
一个标准的右键菜单是这样的
点击代码窗口最右侧按钮,在新窗口打开后复制代码
1 2 3 4 5 6 7 8 9 10 11 12 |
<contextmenu fullscreen="true" versioninfo="true"> <item name="kr" caption="KRPANO" /> <item name="fs" caption="FULLSCREEN" /> <item name="cc" caption="更改控制模式" onclick="cm_changecontrolmode();" separator="true" /> <item name="nv" caption="正常视角" onclick="cm_normal_view();" showif="view.vlookatrange == 180" separator="true" /> <item name="fv" caption="鱼眼视角" onclick="cm_fisheye_view();" showif="view.vlookatrange == 180" devices="flash|webgl" /> <item name="sv" caption="立体视角" onclick="cm_stereographic_view();" showif="view.vlookatrange == 180" devices="flash|webgl" /> <item name="av" caption="建筑视角" onclick="cm_architectural_view();" showif="view.vlookatrange == 180" /> <item name="pv" caption="帕尼尼视角" onclick="cm_pannini_view();" showif="view.vlookatrange == 180" devices="flash|webgl" /> <item name="lp" caption="小行星视角" onclick="cm_littleplanet_view();" showif="view.vlookatrange == 180" devices="flash|webgl" /> <item name="logo" caption="calc:'[img src=[sq]'+network.currentxmlpath+'/krpano_logo.png[sq] style=[sq]width:90px; height:25px; margin:0px 0px -6px -2px;[sq] /]'" separator="true" onclick="openurl('http://krpano.com')" devices="html5" /> </contextmenu> |
如果你是使用官方的默认皮肤,可以直接修改上面的代码。如果不是,你也可以直接复制上述代码到你的xml中。那么上面一共有多少个item就表示右键菜单中有多少个条目。name属性是必须要有的,各个item的name不能一样。
caption就是显示在右键菜单的文字。这里有两个特殊的保留字,一个是KRPANO,这个是显示krpano的官方版权信息条目,如果你没有购买去右键版权的授权,即使你将这一行代码删除,这个显示krpano版权的条目也会显示在最后。
另外一个FULLSCREEN,如果你把它去掉了,它就不显示了,它是用来控制进入或退出全屏的。
caption可以添加简单的html代码,例如加入图片。如logo一项。
点击代码窗口最右侧按钮,在新窗口打开后复制代码
1 |
[img src='examples/custom-contextmenu/krpano_logo.png' style='width:90px; height:25px; margin:0px 0px -6px -2px;' /] |
点击代码窗口最右侧按钮,在新窗口打开后复制代码
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 |
<action name="cm_changecontrolmode"> switch(control.mouse, moveto, drag); switch(control.touch, moveto, drag); </action> <action name="cm_look_straight"> if(view.vlookat LT -80 OR view.vlookat GT +80, tween(view.vlookat, 0.0, 1.0, easeInOutSine); tween(view.fov, 100, distance(150,0.8)); ); </action> <action name="cm_normal_view"> cm_look_straight(); tween(view.architectural, 0.0, distance(1.0,0.5)); tween(view.pannini, 0.0, distance(1.0,0.5)); tween(view.fisheye, 0.0, distance(1.0,0.5)); </action> <action name="cm_architectural_view"> cm_look_straight(); tween(view.architectural, 1.0, distance(1.0,0.5)); tween(view.pannini, 0.0, distance(1.0,0.5)); tween(view.fisheye, 0.0, distance(1.0,0.5)); </action> <action name="cm_fisheye_view"> cm_look_straight(); tween(view.architectural, 0.0, distance(1.0,0.5)); tween(view.pannini, 0.0, distance(1.0,0.5)); tween(view.fisheye, 0.35, distance(1.0,0.5)); </action> <action name="cm_stereographic_view"> cm_look_straight(); tween(view.architectural, 0.0, distance(1.0,0.5)); tween(view.pannini, 0.0, distance(1.0,0.5)); tween(view.fisheye, 1.0, distance(1.0,0.8)); </action> <action name="cm_pannini_view"> cm_look_straight(); tween(view.architectural, 0.0, distance(1.0,0.5)); tween(view.pannini, 1.0, distance(1.0,0.8)); if(view.fisheye LT 0.1, tween(view.fisheye, 1.0, distance(1.0,0.8)); ); </action> <action name="cm_littleplanet_view"> tween(view.architectural, 0.0, distance(1.0,0.5)); tween(view.pannini, 0.0, distance(1.0,0.5)); tween(view.fisheye, 1.0, distance(1.0,0.8)); tween(view.fov, 150, distance(150,0.8)); tween(view.vlookat, 90, distance(100,0.8)); add(new_hlookat, view.hlookat, 123.0); tween(view.hlookat, get(new_hlookat), distance(100,0.8)); </action> |
showif里面是写条件,满足了这个条件的话才会显示这个条目。
老大,FULLSCREEN,能不能改成中文啊