考虑下面的例子。这里我们调用get_weather API，我们将其添加到 API Designer（在创建的函数内）。VTAP.Detail.Record() Javascript API 提供有关记录的详细信息。我们将访问城市学校信息发送联系信以访问天气详细信息。
00-12-43 的截图
获取数据后，我们使用模板中的天气数据，借助方法内部定义的组件特定函数来显示它们。
我们使用VTAP.CustomApi.Get API 通过调用 API Designer 中编写的get_weather API从 openweathermap.org 获取数据。将响应分配给数据变量，以便可以通过以下方式访问：
组件化处理方法
要显示的样本。
方法中编写了许多辅助函数来帮助以可读的格式显示时间和温度。您可以
在此处查看代码。
当您保存并发布脚本并打开与发送邮件的城 我的电话号码 v市相关的联系人时，它将如下所示。但你不觉得这听起来有点无聊吗？为什么不添加地图？
子图像-5
添加可视化组件 - 地图
在这个例子中，让我们添加一个 OpenStreet 地图并在地图上显示邮寄城市。
要添加 Open Road 地图，我们首先需要包含它的库文件。 VTAP 中的 Javascript 库允许在运行时使用VTAP.Resource.Request API 包含任何库。
您可以在注册详细信息小部件本身时包含这些库。
00-24-23 的截图
现在我们需要在WeatherWidgetContent中显示地图。首先在模板中添加一个占位符，并从 get_weather API 获取带有坐标的数据后加载它。您可以从此处的示例中获取完整的脚本并查看其实际运行情况。
子图像-6
现在假设您想将该软件作为扩展模块发布，并且每个客户都想安装该软件并使用他们自己的 openwethermap.org API 密钥。为此，我们可以使用 javascript 存储 API 存储客户数据，并可在 API 设计器中使用占位符变量访问这些数据。