原型设计工具Axure RP新手教程（七）：嵌入媒体教程-谷歌地图

---

Axure RP是一套专门为网站或应用程序所设计的快速原型设计工具， 可以让应用网站策划人员或网站功能界面设计师更加快速方便的建立Web AP和Website的线框图、流程图、原型和规格。

免费下载Axure RP 优惠购买Axure RP

---

在本教程中，您将学习如何使用嵌入式框架窗口小部件将YouTube视频，Google地图和其他媒体嵌入到原型页面中。

嵌入谷歌地图（点击此处查看视频）

小部件设置

• 打开一个新的RP文件，然后在Pages（页面）窗格中双击Page1（页面1）以在画布上将其打开。

• 将内联框架窗口小部件从Libraries（库）窗格拖到画布上。

• 在Style（样式）窗格中，在内联框架Preview（预览）下拉列表中选择Map（地图）。

注意：内联框架预览图像仅显示在Axure RP画布上，它的作用是让您知道框架将在Web浏览器中显示的内容。

从Google Maps获取嵌入URL

• 在网络浏览器中，导航到www.google.com/maps并搜索您想要使用的地址或位置。

• 单击左侧面板中的共享图标。在出现的对话框中，单击Embed a map（嵌入地图）。

• 在选项卡顶部显示的嵌入代码中，找到src属性并突出显示其右侧的URL（不带引号）。复制URL。

注意：该URL会很长，因此请确保突出显示所有内容，直到右引号为止。 例：

//www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3356.8953887537073!2d-117.16021218445606!3d32.71540739443067!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x80d953589d4f36eb%3A0x4c8aa579077a06bd!2s1100%2C+707+Broadway%2C+San+Diego%2C+CA+92101!5e0!3m2!1sen!2sus!4v1558551203274!5m2!1sen!2sus

将内联框架的目标设置为地图的URL

• 返回Axure RP，双击内联框架以打开Link Properties（链接属性）对话框。

• 在对话框底部，选择用于链接到外部URL或文件的单选按钮，然后将您从Google Maps复制的URL粘贴到Hyperlink（超链接）字段中。

• 单击确定关闭Link Properties（链接属性）对话框。

预览页面

• 预览页面，并且Google Map应该出现在嵌入式框架中。

附加信息和提示

嵌入本地内容

要将计算机中的文件嵌入到嵌入式框架小部件中，请使用计算机文件系统中的文件路径（相对或绝对）。双击内联框架，然后在链接到外部URL或文件部分中输入文件路径。

注意：在《内联框架窗口小部件参考指南》中了解使用本地文件的限制。

关注慧聚IT微信公众号???，了解产品的最新动态及最新资讯。