简介
- 该插件可在VR模式下使用！
- 一个简单可定制的热点提示插件，可以在热点上使用。
- 可以定义两种不同的热点（圆形或方形）。
- 可以设置热点的颜色、大小、搏动、透明度和图标
- 可以设置全部的提示或单独进行设置（背景颜色、透明度、位置、大小……）。
- 每个热点都可以单独配置（聚焦、缩放、视场…）。
使用方法
在主xml中嵌入下面文件
|
1 |
<includeurl="plugins/vrtooltip_hotspots.xml" /> |
设置
设置全局属性。
|
1 2 3 4 5 6 7 8 9 10 11 |
<vrtooltip_styletooltips_bgcolor="0x000000" tooltips_bgborder="1 0x000000 0.8" tooltips_bgalpha="0.8" tooltips_bgroundedge="5" tooltips_bgshadow="0 4 10 0x000000 0.3" tooltips_padding="10 15 10 15" tooltips_css="span{font-family:Helvetica; font-size:12px; color:#ffffff; margin:0px;}h1{margin:0px;padding:0px;}" hotspots_bgcolor="0xffffff" hotspots_pulsate="true" /> |
可以在热点中添加可选属性，覆盖上面的全局设置（请参见下面的热点设置）
插件属性
- tooltips_bgcolor
- 热点提示的背景颜色
- 如属性缺失，则使用皮肤所使用的背景颜色
- tooltips_bgborder
- 热点提示的背景边框尺寸
- 如属性缺失，则使用皮肤所使用的边框属性
- tooltips_bgalpha
- 热点提示的背景透明度
- 如属性缺失，则使用皮肤所使用的透明度
- tooltips_bgroundedge
- 热点提示的背景边框半径
- 如属性缺失，则使用皮肤所使用的边框属性
- tooltips_bgshadow
- 热点提示的背景阴影
- 如属性缺失，则使用皮肤所使用的边框属性
- tooltips_padding
- 热点提示的边距
- 默认值=10 15 10 15
- tooltips_css
- 热点提示内容自定义CSS
- hotspots_bgcolor
- 热点的背景颜色
- 可使用 “bgcolor” 属性对每个热点独立属性
- hotspots_pulsate
- 启用或屏蔽热点搏动效果
- 可使用 “pulsate” 属性对每个热点独立属性
- 数值 = true 或 false
热点设置
|
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 |
<hotspotname="spot1" style="hsround" anim="onover" tooltiptext="[h1]scene [/h1][br/][i]italic text[i/]" tooltipposition="top" tooltipdistance="65" tooltipbgcolor="0x000000" tooltipbgborder="1 0x000000" tooltipbgalpha="0.8" tooltipbgroundedge="5" tooltipbgshadow="0 4 10 0x000000 0.3" tooltippadding="10 15 10 15" tooltipcss="span{font-family:Helvetica; font-size:12px; color:#ffffff; margin: 0px;}h1{margin:0px;padding:0px;}" icon="skin/info.png" pulsate="true" bgcolor="0xffffff" activehotspotshape="circle" scale="0.1" focus="true" fov="20" handcursor="true" linkedscene="..." onclick="..." ... /> |
热点属性
- style
- 设置CSS样式.
- 数值 =
hsround(圆形热点)
或 hsdiamon(菱形热点t)
或 hssquare(方形热点)
- anim
- 设置热点提示出现的方式
- 数值 =
onover
或 onclick
或 persistent
- tooltiptext
- 热点提示中显示的文字
- 可使用标准的HTML标签 (例如: [p][/p] [small][/small] [strong][/strong] [h1][/h1]…)
- tooltipposition
- 热点提示相对热点的位置
- 可使用的数值 = lefttop, left, leftbottom, top, bottom, righttop, right, rightbottom
- tooltipdistance
- 热点提示离热点的距离 (以像素为单位)
- tooltipbgcolor
- 覆盖全局属性中的bgcolor
- tooltipbgborder
- 覆盖全局属性中的bgborder
- tooltipbgalpha
- 覆盖全局属性中的bgalpha
- tooltipbgroundedge
- 覆盖全局属性中的bgroundedge
- tooltipbgshadow
- 覆盖全局属性中的bgshadow
- tooltippadding
- 覆盖全局属性中的padding
- tooltipcss
- 覆盖全局属性中的css
- icon
- 如果添加该属性，则为热点添加一个图标
- 数值 = 图像路径
- 最好是高度和宽度是相同的
- 推荐使用png图像 (兼容Base64编码)
- pulsate
- 是否激活热点搏动。
- 该设置可覆盖全局属性(hotspots_pulsate)
- 数值= true 或 false
- bgcolor
- 该设置可覆盖全局属性 (hotspots_bgcolor)
- activehotspotshape
- 当热点提示激活时设置热点的形状
- 数值 =
round(圆形热点)
或 diamon(菱形热点)
或 square(方形热点)
或 circle(圆圈热点)
或 hide(隐藏热点)
- scale
- 热点大小
- focus
- 设置是否聚焦在热点上 (非VR模式下)。
- 数值= true 或 false
- fov
- 设置热点的缩放 (非VR模式下)。
语法例子
|
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 59 60 61 62 63 64 |
<hotspot name="hs01" ath="0" atv="0" style="hsround" tooltiptext="[center]Default round hotspot,[br/][b]basic tooltip[/b].[/center]" /> <hotspot name="hs02" ath="32" atv="0" style="hssquare" scale="0.4" tooltiptext="[center]Default square hotspot,[br/][b]basic tooltip[/b].[/center]" /> <hotspot name="hs03" ath="-32" atv="0" style="hsdiamon" scale="0.4" tooltiptext="[center]Default diamon hotspot,[br/][b]basic tooltip[/b].[/center]" /> <hotspot name="hs04" ath="0" atv="32" style="hsround" scale="0.4" activehotspotshape="circle" tooltiptext="[center]Default diamon hotspot,[br/][b]basic tooltip[/b].[br/][b]Circle hotspot when the tooltip is active[/b][/center]" /> <hotspot name="hs05" ath="63.5" atv="0" style="hsround" scale="0.4" anim="onclick" tooltiptext="[center][b]Tooltip’s animation on click[/b][/center]" /> <hotspot name="hs06" ath="97.25" atv="0" style="hsround" scale="0.4" anim="persistent" handcursor="false" tooltiptext="[center][b]Persistent tooltip[/b][/center]" /> <hotspot name="hs07" ath="126.75" atv="-27" style="hsround" scale="0.4" tooltipposition="bottom" tooltiptext="[center][b]Set tooltip's position[/b][/center]" /> <hotspot name="hs08" ath="126.75" atv="-14" style="hsround" scale="0.4" tooltipposition="rightbottom" tooltiptext="[center][b]Set tooltip's position[/b][/center]" /> <hotspot name="hs09" ath="126.75" atv="0" style="hsround" scale="0.4" tooltipposition="left" tooltiptext="[center][b]Set tooltip's position[/b][/center]" /> <hotspot name="hs10" ath="126.75" atv="14" style="hsround" scale="0.4" tooltipposition="righttop" tooltiptext="[center][b]Set tooltip's position[/b][/center]" /> <hotspot name="hs11" ath="126.75" atv="27" style="hsround" scale="0.4" tooltipposition="lefttop" tooltiptext="[center][b]Set tooltip's position[/b][/center]" /> <hotspot name="hs12" ath="-63.55" atv="0" style="hsround" scale="0.4" icon="skin/info.png" bgcolor="0xff0000" tooltiptext="[center][b]Hotspot with icon and custom color[/b][/center]" /> <hotspot name="hs13" ath="-97.25" atv="0" style="hsround" scale="0.4" pulsate="false" tooltiptext="[center][b]Hotspot without pulse[/b][/center]" /> <hotspot name="hs14" ath="-126.75" atv="0" style="hsround" scale="0.4" onclick="openurl('https://google.fr',_blank);" anim="onclick" tooltiptext="[center][b]Action on a tooltip when clicking[/b][/center][br/][small]example : link to google.com on onClick event[/small]" /> <hotspot name="hs15" ath="-97.25" atv="-32" style="hssquare" scale="0.4" tooltipdistance="30" tooltipbgcolor="0xff0000" tooltipbgborder="2 0xffffff 0.8" tooltipbgalpha="0.5" tooltipbgroundedge="5" tooltipbgshadow="0" tooltipposition="bottom" tooltiptext="[center][b]Example of personalized tooltip[/b][/center]" /> <hotspot name="hs16" ath="-97.25" atv="32" style="hsdiamon" scale="0.4" tooltipdistance="75" tooltipbgborder="0 0xffffff 0.8" tooltipbgalpha="0" tooltipbgroundedge="5" tooltipbgshadow="0" icon="skin/eyes.png" bgcolor="0x000000" tooltiptext="[center][h2]Example of personalized tooltip[/h2][/center]" /> |