地图元素
地图和平面图可以通过在工具栏中选择地图元素并在画布中单击以添加来轻松添加到皮肤中。
矩形
边境
文本字段的边框或轮廓。单击每个参数旁边的“ 切换单个值/分隔值” 按钮,可在调整整个边框或单独调整边框的每个边缘之间切换。
-
宽度 – 定义边框的宽度。 -
半径 – 增加此数字将使矩形的角变圆。可用于创建圆圈。 -
颜色 – 为边框选择颜色。✭ 逻辑块可用。
地图
地图类型
选择添加地图或平面图。设置将根据所选类型进行调整。
地图
地图 – 选择 Google 地图的类型,或在漫游地图中添加的地图:
-
谷歌路线图 -
谷歌混合 -
谷歌卫星 -
谷歌地形 -
项目中的第一张地图 – 选择此选项可显示项目中的第一张地图(添加到游览地图中)。在组件或皮肤中使用它,该组件或皮肤将自动使用项目中的第一个地图。
如果在漫游地图中添加了自定义地图,那么您也可以在此处选择它。
API – 如果已从“地图”菜单中选择了自定义地图或平面图,则此选项将可用。从以下选项中选择:
-
自动 – 选择自动,让 Pano2VR 检测使用适当 API 的地图类型。例如,Google API 将用于 Google 自定义地图和 Google 地图,而 Leaflet API 将用于其他所有内容。 -
谷歌 – 如果选择 Google API,则需要 API 密钥。见下文。 -
传单 – 此地图 API 不需要密钥,它是开源的。
Google API 密钥 – 输入您的 Google API 密钥以验证 Google 地图。为了使地图正常工作,您需要从 Google 获取 API 密钥。您想要使用 Google API 显示的所有地图都需要一个密钥;不仅仅是谷歌地图。 了解如何创建密钥 。✭ 设置此密钥时,请确保将此密钥锁定到您的域(HTTP 引荐来源网址)。✭ 请勿使用与漫游地图相同的密钥(用于为 Google 街景添加地点 ID)。
初始缩放 – 设置地图的缩放级别。默认值为 标记边界(Marker Bounds),它会自动将缩放级别设置为地图引脚的边界。级别也可以在 0 到 23 之间定义。0 将显示整个世界,而 23 是最大缩放。
卫星地图 – 仅当选择 Google 卫星作为地图时才可见。选择禁用 45º 视图以禁用放大时更改为 Google 的 45º 视图。
UI – 地图用户界面的设置。
地图控件 – 选择以显示地图控件(放大/缩小)。
分数缩放 – 选择以允许较小的缩放步长(在缩放级别之间)。分数缩放适用于鼠标控制和捏合缩放。 地图控件仍将缩放更改一个完整的级别。★ 仅适用于 Leaflet API。
节点更改 – 选择 居中节点 ,使当前活动节点始终在地图中居中。这样,如果用户被放大并在游览中移动,地图将跟随并始终将当前节点保持在视图的中心。
雷达 – 选择启用以包括显示朝向的雷达波束。
-
颜色 – 选择雷达波束的颜色。 -
尺寸 – 调整雷达波束的大小。
标签聚类 – 选择、 启用以在单个标记下聚类区域中的多个节点。单击标记时,将显示聚类。
标签聚类
克隆为标记 – 使用此选项为地图标记选择自定义图像。
固定顺序 – 从以下选项中进行选择,以指定将标记添加到地图的顺序。这有助于防止图钉本身重叠图钉元素(缩略图、工具提示)。
-
导览浏览器 – 图钉的顺序将按照导览浏览器中设置的顺序排列。 -
从上到下 – 固定顺序将从上到下。 -
从下到上 – Pin 顺序将从下到上。 -
从左到右 – 固定顺序将从左到右。 -
从右到左 – 固定顺序将从右到左。
平面图叠加 – 如果您添加了平面图并对其进行地理定位,则可以选择将其中一个平面图叠加到地图上。
不透明度 – 定义平面图图像的不透明度。
加载 – 隐藏时卸载地图 – 选择以在通过皮肤作隐藏地图时卸载地图。这意味着,当选择后,当地图被隐藏并再次显示时,地图将重置并以游览图钉为中心。如果未选择此选项,则地图将保持与隐藏时相同的位置。
平面图
平面图 – 选择已添加到游览地图的平面图。在组件或外观中选择 “项目中的一楼平面图”,以使用一楼平面图而不是特定平面图。
-
简单平面图 – 选择后,平面图将无法缩放或平移,不需要互联网访问,并且将缩放以适合地图元素。如果取消选择,则可以平移和缩放平面图,但需要访问互联网。 -
自动切换平面图 – 选择以根据当前节点自动切换平面图。缩放级别和平面图中的位置被调用。
初始缩放 – 设置地图的缩放级别。默认值为 标记边界(Marker Bounds),它会自动将缩放级别设置为地图引脚的边界。级别也可以在 0 到 23 之间定义。0 将显示整个平面图,而 23 是最大缩放。(如果选择了简单平面图,则不可用。
UI – 选择以显示地图控件(放大/缩小)。(如果选择了简单平面图,则不可用。
节点更改 – 选择节点更改时应发生的情况。
-
中心节点 – 选择以在节点更改时将节点的地图引脚保持在平面图的中心。(如果选择了简单平面图,则不可用。 -
自动切换平面图 – 选中后,用户移动到不在当前平面图上的节点,地图将自动切换到当前节点的平面图。如果未选择此选项,则平面图将不会切换。
雷达 – 选择启用以包括显示朝向的雷达波束。
-
颜色 – 选择雷达波束的颜色。 -
尺寸 – 调整雷达波束的大小。
克隆为标记 – 使用此选项为平面图标记选择自定义图像。 了解如何作。
Pin Order – 选择哪些 Pin 优先于其他 Pin。当有许多节点并且引脚是聚类的时,您可以使用引脚顺序来影响哪些引脚被覆盖。
对齐 – 选择简单平面图在地图元素中的对齐方式。
加载中 – 隐藏时卸载地图 – 选择以卸载通过蒙皮作隐藏平面图。这意味着,选择后,当平面图被隐藏并再次显示时,它会重置并以游览标记为中心。如果未选择此选项,则平面图将保持与隐藏时相同的位置。
位置
身份证
为元素指定唯一的 ID 或名称。ID 是自动给出的,当添加多个 ID 时,将按数字排序。如果某个 ID 已被另一个元素使用,则输入字段旁边将出现一个警告符号。
点热点模板将有一个菜单,显示所有默认模板 ID 以及项目中使用的任何模板 ID。
★ 提示: 单击警告符号可为该元素创建唯一 ID。
位置
元素的 X 和 Y 坐标。
元素的位置相对于其父元素及其锚定位置(Canvas 是顶级元素的父元素)。
例如,锚定并放置在画布中间的视频将将其锚点设置为中心 ,X 和 Y 设置为 0。因此,如果元素锚定到水平中心,则 X 坐标是从父元素中心到元素水平中心测量的。同样,如果一个元素锚定在右侧,则 x 坐标是从父元素的右侧到元素的右侧测量的,如箭头所示。
★ 提示: 双击箭头将 X 和 Y 设置为
0。这使得精确定位元素变得更加容易,尤其是在播放器的边缘。例如,要使元素保持在播放器的底部中心并与边缘保持一定距离,请将锚点设置为底部中心,并将 Y 值设置为 20 像素,将 X 值设置为 0。
X 和 Y:
-
百分比 – 根据玩家的大小/窗口设置元素位置的单位。 -
像素 – 用于设置元素在蒙皮中的实际位置的单位。 -
CSS – 选择 CSS 作为单位,以允许在添加逻辑块时更改单位或使用计算。
示例:将 x 位置单位设置为 CSS。在编辑字段中输入100px。添加一个逻辑块,选择一个触发器,然后增加20%的大小,有效地切换单元。
锚
使用此网格将元素“粘贴”到播放器窗口的一部分。请参阅上文 ,了解锚点如何影响位置。
大小
热点模板(Hotspot Template) 和 节点标记(Node Marker) 没有大小参数。
以像素为单位调整元素的大小(宽度和高度)。 宽度和高度 :
-
百分比 – 根据玩家的大小/窗口设置元素大小的单位。 -
像素 – 设置元素实际大小的单位。 -
锁定纵横比 – 单击链接图标以在画布中调整大小或在属性面板中更改大小值时锁定元素的大小纵横比。当选择另一个元素时,此按钮将重置为关闭 。 -
CSS – 选择 CSS 作为单位,以允许在添加逻辑块时更改单位或使用计算。
示例:将元素定位在距顶部 50 像素的位置,然后将高度设置为calc(100% - 50px)。然后,该元素将始终与顶部保持相同的距离,即 50px,并将直接向下延伸到底部。
-
重置大小 – 适用于图像、按钮和 SVG 元素。单击以返回图像的原始大小。 -
重置大小/2 – 可用于图像、按钮和 SVG 元素。当您想要将 PNG 或 JPG 添加到项目中,但仍希望它在 Hi-DPI 显示器中看起来清晰时,请使用此选项。例如,如果皮肤需要 32 像素的图像,请使用 64 像素的图像,然后单击重置大小/2。这将使其在皮肤中达到 32 像素,但仍具有高分辨率显示的所有像素。
外观
缩放
沿 x 轴和 y 轴缩放元素。例如,将任一轴上的值加倍,元素的大小将加倍。如果启用了缩放修饰符,则忽略此缩放设置。
中心
使用此网格可以确定元素的缩放方式。默认值设置为中心,以便元素将从其中心缩小或缩小。例如,如果将缩放锚定到左上角,则缩放将从该点居中。
角度
使用此参数调整元素的角度。它将使用中心网格(上图)作为其轴。例如,如果选择中心,它将围绕其中心旋转。如果选择左下角,按钮将围绕该角旋转。
可见
选择或取消选择以使元素保持可见或不可见。可见性或不可见性可以通过作进行更改和切换。
阿尔法
元素的透明度。设置为 1.000 是不透明的。降低此数字将增加元素的透明度。
光标
选择鼠标在元素上滚动时显示的光标。
继承 – 元素将从其父元素继承光标。这是除 Button 和 Seekbar 之外的所有元素的默认设置。
手 – 手形光标将显示。这是 Button 和 Seekbar 元素的 deafult。选中后,光标不会从其父元素继承。
默认 – 选择此选项可强制浏览器的默认光标(通常为箭头)。选中后,光标不会从其父元素继承。
掩蔽
仅容器和矩形元素选择“已启用”以激活掩码。掩码意味着容器或矩形的子元素将在容器或矩形的边界处被裁剪。
可及性
选项卡索引
要使皮肤元素可通过键盘控制,必须将它们添加到网页的 Tab 键顺序中。制表符索引 -1(默认值)会从 Tab 键顺序中排除该元素。制表符索引 0 将元素包含在制表符顺序中。浏览器将通过在活动元素周围放置一个矩形来突出显示活动元素。一旦皮肤元素成为活动元素(由突出显示指示),请按 Enter/Return 键触发其单击作。
ARIA 标签、描述、详细信息
这些是用于定义元素和支持角色的属性或属性。
标签 – 定义或命名元素。
描述 – 提供元素的简要描述。
详细信息 – 提供元素的扩展、详细描述。
ARIA 角色
ARIA 角色用于定义 UI 元素(按钮、加载栏等)。从列表中选择最能定义元素的元素。
隐藏
选择以隐藏所有 ARIA 属性。
高深
z-index
设置 CSS z-index 属性 。使用数字设置堆叠顺序或将设置保留为默认值。默认将使用树中设置的堆叠顺序。
这用于确保元素以正确的堆叠顺序显示,尤其是在靠近或重叠时。
可渗透的
选择以确保元素不接受鼠标单击。当您想要在皮肤中包含元素但又不希望它妨碍与全景交互的能力时,这非常有用。例如,您可以添加晕影、徽标或边框,单击这些晕影或徽标或边框,将允许与全景图进行交互。
热点代理 ID
输入相应的 ID。该 ID 来自热点属性中热点的 ID 字段。热点代理使您能够将皮肤元素链接到特定热点。这意味着该元素将接收与热点相同的鼠标和触摸事件(鼠标单击、鼠标双击、鼠标进入和鼠标离开)。您还可以添加 {} 以将节点 ID 用作热点代理。 了解更多 。
CSS 类
输入所选元素的 CSS 类名称。您可以输入多个以空格分隔的类。如果您需要更多空间,请单击字段右侧的编辑按钮以获得更大的文本字段。没有点 。 需要。
CSS 样式
输入所选元素的 CSS 样式属性。您可以输入多个用分号分隔的样式。如果您需要更多空间,请单击字段右侧的编辑按钮以获得更大的文本字段。
CSS 样式内部元素
输入所选元素的内部元素的 CSS 样式属性。(某些皮肤元素,如 Image、Video 和 External Image,在元素的主 <div> 内嵌套了一个内部元素。
例如,图像元素可以有一个边框: border-radius: 20px; border: 5px solid red; 。也可以用换行符输入:border-radius:20px; 边框:5px 纯红色;
添加了 CSS 边框的图像
捷径
输入首选键以控制为元素定义的作。例如,选择文本字段,按键盘上的向上键。然后添加鼠标单击作。单击或按下向上键时,该元素将执行分配的作。
从翻译中排除
选择此选项可不将此元素包含在皮肤的翻译文件中。
安全区域
可用于容器元素 。
选择 “使用安全区域作为位置和大小 ”,将容器的子元素保持在设备的安全区域内。此选项可确保元素始终 100% 可见,并且皮肤会自动对设备的安全区域做出反应。
确保在 Web 输出的 HTML 模板设置中未选择“ 忽略安全区域 ”。
动作
可以将作或一组方向应用于添加到皮肤的任何元素以创建交互性。
双击“作”区域或单击右侧的加号以打开“作设置”。
有关所有作的详细信息,请参阅皮肤作 。
修饰 符
添加修改器允许您在平移、倾斜、缩放或加载全景图时使元素移动、缩放或旋转。使用修饰符的一个很好的示例是加载条,该加载条会根据已加载的全景图量进行缩放。
双击 修改器(Modifiers) 区域或点击右侧的加号以打开 修改器设置(Modifier Settings)。
有关所有修改器的更多详细信息,请参阅蒙皮修改器 。
笔记
使用此部分添加有关元素的信息。如果您有一个组件并想要解释该组件中的元素,这尤其有用。
注释将在树中显示为工具提示。