地图(OpenLayers)

■ 部件外观

■ 描述

绘制地图的控件。

当地图上的标记被点击时，可以跳转到标记相关联的网页或HMI的页面和图层。也会触发一个事件，通知点击的标记及关联的数据。

■ 事件

本部件可用事件列表。

事件名称	值	说明
!onClickMarker	integer index, string title,string value	单击标记时发生的事件。 输出标记在CSV文件中的序号、标题、和关联的自定义数据。
!onClickData	float latitude,float longitude,float radius,string csvdata	单击标记或聚类标记时，将发生此事件。 输出标记的纬度、经度、聚类标记的半径（km）和CSV数据到变量链接中设置的变量中。在详细属性中可以设置要CSV数据的内容。

■ 属性

本部件可用属性的一览。

对于各部件的共同属性，请参见共同项目页面。

属性名称	默认值	说明
File		通过CSV文件设定地图上显示的标记的座标、链接、图像等。
TriggerRefresh	0	更改值后，将重新加载File属性的CSV。 更改值后，将重新加载File属性的CSV。 更改值后，将重新加载File属性的CSV，或指定的数据库I表格的数据。
FileLine		设置CSV文件以作为地图上绘制线条的输入。
TriggerLineRefresh	0	更改值后，将重新加载FileLine属性的CSV。
linePointX		从标记画线时使用的X坐标。 相对与页面顶部以px单位指定数值。
linePointY		从标记画线时使用的Y坐标。 相对与页面左边以px单位指定数值。
lineVisible	true	设置显示或隐藏从标记绘制到指定坐标的线。

■File属性中设定的CSV文件的数据格式

CSV文件中的数据，如下设置。字符代码为UTF-8。

在行的开头使用＃将其视为注释行。

•第1列，设置标记的纬度。

•第2列，设置标记的经度。

•第3列，设置标记的标题。标题在鼠标停留在标记上时显示。

•第4列，设置标记的网址，点击标记时打开此网址。

通过将该列的值设置为“ page_id：任何页面ID/layer_id：任何图层ID”，您可以设置任何页面的层。

•第5列，设置标记的图像。图像的URL有误时，将显示缺省的图像。

如果此列中的值以“/viewer/setting”开头，则可以指定已上传到此项目（Project）的文件。

•第6列，设置如何打开网址。如果设定为“true”或“TRUE”，在当前页面打开网页；设定为“false”或“FALSE”，将以新的页面打开网址。

•第7列，设置标记的标签。标签将显示在地图上标记的上方。

•第8列，设置标记的标签的大小。以px（像素点）单位指定大小，也可以指定为“small”（小），“medium”（中），“large”（大）。

•第9列，设置标记的标签的颜色。以十六进制数指定颜色。如“#FF0000”为红色，“#00FF00”为蓝色。

•第10列，设置要通过标记事件输出自定义数据。(value)

•第11列，设置一个变量链接以切换标记图像。当变量的值为false时，显示第5列设置的图像；当变量的值为true时，显示第12列设置的图像。

•第12列，设置切换标记图像时要显示的图像的URL。 如果图像URL不正确，则显示默认标记。

如果此列中的值以“/viewer/setting”开头，则可以指定已上传到项目的文件。

实际CSV的示例如下所示。

35.65858,139.7454,东京铁塔,https://www.tokyotower.co.jp/,/viewer/setting/image/tower.png,false,tower,10px,white,test,link,/viewer/setting/image/tower2.png

■FileLine属性中设定的CSV文件的数据格式

CSV文件中的数据，如下设置。字符代码为UTF-8。

在行的开头使用＃将其视为注释行。

•第1列，设置线宽（以像素为单位）。

•第2列，设置线色。对于颜色，您可以使用关键字指定，例如CSS中使用的“红色”“蓝色”或十六进制名称，例如“#ff0000”·“#00ff00”。

•第3列，设置线型。 当此值设置为“箭头”时，线条的尖端变为箭头。 此外，如果该值设置为“Dash”，则该线变为虚线。

•在第4列之后的偶数列上，设置坐标的纬度。 要通过连接这些坐标绘制线条，请设置两个或更多坐标。

•在第5列之后的奇数列上，设置坐标的经度。 要通过连接这些坐标绘制线条，请设置两个或更多坐标。

实际CSV的示例如下所示。

2, #ff0000, Arrows, 34.68401215, 135.505125, 34.73142753, 135.423515, 34.66820098, 135.1790692, 34.6523868, 135.0170209, 34.79009462, 134.6709515, 34.51187376, 133.9435612

■ 一般

在一般页面，设置地图显示的一般选项。

□ 纬度

输入中心点的纬度。

□ 经度

输入中心点的经度。

□ 缩放

设定缩放的比率。

□ 获得中心座标

获得当前显示地图的的中心座标和缩放倍率。

□ 地图类型

设置要显示的地图类型。

□ TriggerRefresh的操作条件

设置是否仅在属性TriggerRefresh的值增加时，重载CSV刷新显示。

设置是否仅在属性TriggerRefresh的值增加时，重载CSV刷新显示。

设置是否仅在属性TriggerRefresh的值增加时，重载CSV或数据库表格的数据，以刷新显示。

□ TriggerLineRefresh的操作条件

设置是否仅在属性TriggerLineRefresh的值增加时刷新CSV。

□ 根据缩放级别更改标记大小

如果启用，请根据当前缩放级别调整标记图像的大小。

□ 基准缩放比例

设置基准缩放级别，作为标记图像在缩放前的基准大小。

当基准缩放比例大于当前缩放比例时，标记的图像的大小将变小。 当基准缩放比例小于当前缩放比例时，标记的图像尺寸将变大。

□ 根据缩放级别对标记进行聚类

如果启用，地图将根据缩放的比例，将一定半径内的标记缩小为一个聚类标记，聚类标记上表示聚合的标记的数量。

□ 背景颜色

设定聚类标记的背景颜色。

□ 字体颜色

设定聚类标记的字体颜色。

□ 聚类半径(px)

设定聚类标记的半径(px)。

□ 适用座标和缩放

适用输入的中心座标和缩放倍率，变更地图显示的中心位置。

□ 从标记到指定坐标画一条线

启用后，从单击的标记到属性中指定的坐标绘制一条线。

□ 线色

设置从标记绘制的线条的颜色。

□ 线宽

设置从标记绘制的线条的宽度。

■ 标记数据

标记数据页面，设定(!onClickData)事件的输出内容。

标记数据页面，设定(!onClickData)事件的输出内容。

标记数据页面，设定数据的读取方法和(!onClickData)事件的输出内容

□ 使用CSV文件

如果此选项被选中，将从File属性指定的CSV文件，读取在地图上显示的标记所需的数据。

□ 使用数据库表格

如果此选项被选中，将从指定的数据库表格和列，读取在地图上显示的标记所需的数据。

□ 表格ID

如果使用数据库表格，在此指定要读取的数据库的表格ID。

□ 项目

设定地图上显示的项目。

如果使用数据库表格，可以追加项目。追加的项目，可以在(!onClickData)事件的csvdata参数中输出。

□ 列名

指定数据库表格的列名。

□ 通知

如果选中，在(!onClickData)的csvdata中输出此列的数据。