MapGuide Viewer

MapGuide提供了两种显示地图的方式：基本Web布局(Basic Web Layout)和灵活的Web布局(Flexible Web Layout)。灵活的Web布局可以工作在Windows、Macintosh和Linux，使用了JavaScript，无需任何客户端浏览器插件或私有技术。因为它能够提供更好的灵活性，所以Autodesk推荐用户在开发新的MapGuide应用程序时使用灵活的Web布局。本章中，我们只介绍基本Web布局。
1.DWF Viewer和AJAX Viewer
在MapGuide应用程序中，使用MapGuide Viewer在浏览器中显示地图数据。MapGuide Viewer支持缩放地图、主题化(Theming)和选择要素。MapGuide Viewer有两个版本。

DWF Viewer：只能运行在IE，要求安装一个浏览器插件。
AJAX Viewer：能够运行在IE、Mozilla FireFox和Safari，无需安装浏览器插件。

这两个版本的Viewer有着非常相近的用户界面和操作风格。如果用户使用IE浏览器，那么DWF可能是一个合适的选择。但是，用户会使用其它浏览器，那么AJAX Viewer是一个更好的选择。
尽管MapGuide应用程序可以仅仅执行一些地理空间数据分析，而不显示任何地图数据，但是大部分MapGuide应用程序使用了Viewer。
标准的Viewer使用如下可选的用户界面组件来显示地图。

工具栏(Tool Bar)
图层窗格(Layers Pane)
属性窗格(Properties Pane)
状态栏(Status Bar)
任务列表(Task Bar)：通常是隐藏的。
任务窗格(Task Pane)
上下文菜单(Context Menu)
缩放滑块(Zoom Slider)：只有在AJAX Viewer中可以使用。

工具栏、任务列表、任务窗格和上下文菜单包含一些预定义或自定义的MapGuide命令。
一个Web布局(Web Layout)定义了Viewer的界面和可用的操作。我们可以用Web布局定制那些可选的用户界面组件显示在Viewer中，通过自定义命令(Custom Command)添加一些自定义的功能到Viewer中。
1.1自定义命令 (Custom Command)
自定义命令有两种类型：

JavaScript命令
使用PHP、ASP.NET或JSP编写的web服务器扩展页面(Web Server Extensions Page)。
JavaScript命令在Web布局中定义为调用脚本(Invoke Script)类型的命令，主要用于和Viewer进行交互，能够调用Viewer API。

Web服务器扩展页面能同通过两种方式加入到Web布局中。一种方式是Web布局包含一个主页，当第一次显示地图时将这个主页加载进任务窗格。通过点击任务窗格上的Home图标，这个主页可以被再次加载。这个主页也可以按需加载其它网页。
而且，其它任务页在Web布局中被定义为一个激活URL(Invoke URL)类型的命令，它可以被添加到工具栏、任务列表或上下文菜单中。当用户选择这样一个命令，对应的URL的会被加载到任务窗格。当然，如果它不可见的话，也可以被加载到一个隐藏的HTML框架(Frame)中。
因为Web服务器扩展页面是在传输到Viewer前在Web层创建的，所以它可以调用Web Server Extensions API和Viewer API。
1.2Viewer中的框架(Frame)
MapGuide Viewer使用HTML框架(Frame)将Viewer分割为多个区域，下图显示了这些框架和框架集(Frame Set)的位置。

名称	描述
	未命名的。包含Viewer所有的框架。它可以被一个外面的框架包裹，以便Viewer可以嵌入到你的网站页面中。
maparea	包含工具栏、mapFrame、formFrame和scriptFrame的框架集。
tbFrame	包含工具栏的框架。通过修改Web布局可以增加新的命令到工具栏。
mapFrame	包含地图数据的框架。它包含地图窗格、图层窗格和属性窗格。
formFrame	用于生成发送数据到服务的HTTP POST请求的隐藏框架。
scriptFrame	用于加载和执行对用户不可见的页面。通常，它用于执行客户端JavaScript。
taskArea	包含任务栏和taskFrame的框架集。
taskBar	包含任务栏的框架。
taskListFrame	用于显示任务列表的框架。它通常是隐藏的，当用户点击任务栏上的任务列表按钮时，它会显示出来。通过修改Web布局可以增加新的命令到任务列表中。
taskPaneFrame	用于显示和执行MapGuide页面。在每个Web布局加载的时候，布局有一个显示在任务窗格的主页。激活URL类型的命令也加载到任务窗格。
sbFrame	包含状态栏的框架。

2.MapGuide Viewer API
MapGuide Viewer API是用户和Viewer交互的一个JavaScript函数集。许多Viewer框架内包含了一些内嵌的JavaScript函数，而且这些函数可以在其它地方被调用。如果要调用Viewer API函数，只要在嵌入网页的JavaScript中调用它们即可。你可以通过下列任意一种方式调用Viewer API。
在Web布局中定义一个调用脚本(Invoke Script)类型的命令。当你想在工具栏、任务列表或上下文菜单中调用Viewer API时，就可以使用这种技术。
加载一个页面到隐藏的脚本框架(scriptFrame)中，在页面加载的时候执行脚本。当你想在Viewer所在页面中执行一些操作而不重新加载此页面时，就可以使用这种技术。
从任务窗格中已经加载的页面执行JavaScript调用。当页面第一次加载时执行JavaScript，或作为用户交互的结果执行JavaScript。
了解框架(Frame)之间的关系是非常重要的。通常，JavaScript既可以在单个框架中执行。也可以通过在框架层次树中定位其它框架来调用其它框架中的函数。下面的框架是主框架的子框架。

tbFrame
mapFrame
formFrame
scriptFrame
taskFrame

taskPaneFrame是taskFrame的子框架。
自定义的JavaScript代码可以在主框架、scriptFrame或taskPaneFrame中执行。定义为调用脚本(Invoke Script)类型命令的脚本能过在主框架中执行。如果要执行其它框架中的函数，只需使用框架名加函数名调用它。例如：可以从主框架中使用下列代码调用mapFrame中的函数ZoomToView()。
mapFrame.ZoomToView(xLoc, yLoc, newScale, true);
如果要在加载到scriptFrame中的JavaScript中调用此方法，必须使用parent在框架层次结构中上升一层。例如：
parent.mapFrame. ZoomToView(xLoc, yLoc, newScale, true);
如果要在加载到taskPaneFrame中的JavaScript中调用此方法，必须使用parent.parent在框架层次结构中上升两层。例如：
parent.parent.mapFrame. ZoomToView(xLoc, yLoc, newScale, true);
许多Viewer API会自动产生对站点服务器的请求，以刷新Viewer中的数据或通知站点服务当前Viewer的状态变化。
2.1使用调用脚本(Invoke Script)类型的命令调用Viewer API
当你想在工具栏、任务列表或上下文菜单中调用Viewer API时，就可以使用这种技术。例如：你想在工具栏创建一个按钮用于缩放和平移地图应显示一个特定的位置。在Web布局中创建一个调用脚本(Invoke Script)类型的命令，可以输入如下API调用代码作为需要需要调用的脚本。
ZoomToView(-87。7116768, 43。7766789973, 5000, true);
添加按钮到工具栏，当用户点击这个按钮，地图视图就会重新定位到指定的位置。
调用脚本(Invoke Script)类型的命令总是在主框架上下文环境中执行，这就意味着你可以调用所有主框架的函数。如果要调用其它框架中的函数，需要在函数名称前添加框架名。例如：formFrame.Submit()。
2.2从scriptFrame中调用Viewer API
当你调用Viewer API执行一些操作，只想得到操作结果而不希望重新加载页面时，就可以使用这种技术。例如：假设网页中有一个位置列表，你希望用户能够跳转到位置列表中指定的任何位置，而保持位置列表在任务窗格中无需刷新。
在这种情况下，你可以使用target=”scrptFrame”作为<a>标记的一部分，在自己的页面中使用隐藏的scriptFrame框架加载另一个页面。这种办法需要创建一个独立的页面来加载到scriptFrame框架中，并且在页面加载时传入必要的参数。
首先，我们创建一个文件gotopoint.php，这个文件设计来在scriptFrame框架中运行。这个页面中的<body>元素是空的，只嵌入了一个JavaScript函数onPageLoad()。这个函数调用了函数ZoomToView，在页面加载的时候会被执行。文件gotopoint.php的核心代码如下：
<script language="javascript">
function OnPageLoad()
{
parent.ZoomToView(<?= $_GET['X'] ?>, <?= $_GET['Y'] ?>,<?= $_GET['Scale'] ?>, true);
}
</script>
<body onLoad="OnPageLoad()">
</body>
要在taskFrame框架中执行gotopoint.php，只需要插入类似于下面的代码。
$xLocation = -87.7116768; // Or calculate values
$yLocation = 43.7766789973;
$mapScale = 2000;
echo "<p><a href=\"gotopoint.php?" .
"X=$xLocation&Y=$yLocation&Scale=$mapScale\"" .
"target=\"scriptFrame\">Click to position map</a></p>";

2.3从任务窗格中调用Viewer API
当你在加载页面时调用Viewer API，或作为onclick事件的结果调用Viewer API，就可以使用这种技术。例如：在任务列表中有一个任务用来缩放地图到一个预定义的位置，而无需用户的任何输入，Viewer应该在页面加载是立即缩放。
mapFrame框架中有一个函数可以在指定的比例下(Scale)将地图中心点定位于指定的位置，下面的例子中使用了这个函数。将这个例子加入任务列表中，选择这个任务，当前地图将会重定位到指定的位置。
<head>
<title>Viewer Sample Application - Zoom</title>
</head>
<script language="javascript">
function OnPageLoad()
{
parent.parent.ZoomToView(-87.7116768, 43.7766789973, 5000, true);
}
</script>
<body onLoad="OnPageLoad()">
<h1>Zooming...</h1>
</body>
</html>
2.4扩展地图初始化功能
有时，当第一次加载地图的时候，需要执行一些初始化功能，我们可以将一个加载到任务窗格的页面衔接到标准的地图初始化过程来实现这样的功能。
例如：当浏览器第一次连接到MapGuide网站时，指定了一个Web布局。网站使用这个布局来决定启用那种类型的Viewer和显示那张地图。在任务窗格第一次加载时，地图名称时未知的。而对于某些操作这是必需的，通过扩展地图初始化功能，我们可以解决这个问题。

3.Hello Viewer例子
在MapGuide的安装包中有一个Hello Viewer的例子，这个例子展示了如何在Web布局的不同部分使用Viewer API。
在这个例子中，工具栏上有一个调用脚本(Invoke Script)类型的命令，这个命令调用了mapFrame框架中的函数ZoomToView()。它在主框架的上下文环境中执行，所以这个函数通过如下的方式调用。
mapFrame.ZoomToView();
任务窗格加载了一个页面用于展示两种调用ZoomToView()的调用方法。一种方法是加载一个自定义的页面到隐藏框架scriptFrame中，读取GET参数，将他们传递给JavaScript函数。这种方法在scriptFrame框架中执行，所以这个函数通过如下方式调用：
parent.mapFrame.ZoomToView();
另一种调用ZoomToView()的方法在点击一个链接的时候使用JavaScript的onclick事件。这种方法在taskPaneFrame框架中执行，所以这个函数通过如下方式调用：
parent.parent.mapFrame.ZoomToView();
这个例子也展示了一种更加高级的在Viewer中使用JavaScript的方法。文件index.php包括两个外部的文件，以解决如下两个问题。

当地图被第一次加载时，任务窗格在地图尚未完全初始化前就显示出来了。如果用户点击任何任务窗格上的链接，可能会导致一个不可预知的错误，因为这些链接可能依赖于当前可用的地图。
在Viewer首次加载一个页面到任务窗格中时，它将SESSION和WEBLAYOUT传递为GET参数。在Web布局完全加载前，地图名称是未知的。当用户点击Home按钮，Viewer会重新加载任务窗格中的主页，要求SESSION和MAPNAME作为GET的参数。在许多情况下，我们需要在地图首次加载时获得地图的名称。

为了解决这个问题，Hello Viewer例子使用了脚本pageLoadFunctions.js，它会为任务窗格页面的window.onload事件附加一个函数。这个函数执行下列操作：
替换主框架中OnMapLoaded()函数。这个函数在地图完全初始化后调用。新版本的函数执行一些初始化工作，然后调用原始的OnMapLoaded()函数。
保存任务窗格中的内容，加它替换为文本”Loading”。
在地图完全初始化后，调用新版本的OnMapLoaded()。此时，地图的名称是已知的了，可以通过调用mapFrame.GetMapName()获得。新版本的OnMapLoaded()会存储任务窗格中的内容，然后查找所有<a>元素，将“MAPNAME=unknow”替换为正确的地图名称。

4.在你的网页中嵌入一个Viewer
如果要将MapGuide Viewer嵌入你自己的网站，最简单的办法是创建一个框架集，这个框架集包含一个用于放置你自己页面的框架和一个用于嵌入Viewer的框架。MapGuide的开发例程中使用的也是这种技术。这些例子的主页main.php创建了一个框架集，顶部的框架包含了一个网站相关的页头，底部框架包含了嵌入的Viewer。下面的代码是main.php的主要内容。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
<?php
require_once('common/common.php');
try
{
// Initialize the web extensions,
MgInitializeWebTier ($webconfigFilePath);
// Connect to the site server and create a session
$userInfo = new MgUserInformation("Author", "author");
$site = new MgSite();
$site->Open($userInfo);
}
catch (MgException $e)
{
echo "Could not connect to the MapGuide site server.";
die();
}
try
{
$sessionId = $site->CreateSession();
// Define some constants
$webLayout = "Library://Samples/Layouts/SamplesPHP.WebLayout";
$title = "Samples";
}
catch (MgException $e)
{
echo "ERROR: " . $e->GetMessage("eng") . "\n";
echo $e->GetStackTrace("eng") . "\n";
}
?>
<html>
<head>
<title><?= $title ?></title>
</head>
<frameset rows="110,*">
<frame src="common/Title.php?TitleText=<?= $title ?>"

name="TitleFrame" scrolling="NO" noresize />
<frame src="/mapguide/mapviewerajax/? SESSION=<?= $sessionId ?>&
WEBLAYOUT=<?= $webLayout ?>" name="ViewerFrame" />
</frameset>
</html>

MapGuide Viewer相关推荐

MapGuide应用程序示例——你好，MapGuide！
图 3‑4显示了基于MapGuide的Web应用程序的开发流程,整个开发流程可以分为五个阶段.图中,矩形代表任务,椭圆形被任务使用的或被任务创建的实体,箭头代表数据流. 1) 加载文件类型的数据,配置 ...
MapGuide API
1.1 MapGuide API MapGuide是一个三层架构的Web GIS系统,所以MapGuide API也分为了两大类:服务器端API和客户端API,如图3-1所示. 图3-1 MapGu ...
MapGuide的系统架构
MapGuide由四个独立的组件(Component)构成,它们分别是: MapGuide Server MapGuide Web Extensions MapGuide Studio MapGuid ...
MapGuide概述与特点
2.1 MapGuide概述与特点 MapGuide是Autodesk公司推出的在网络上发布空间数据的新一代Web GIS平台,为了促进开源Web GIS的发展,Autodesk公司推出了开源版的Ma ...
面向企业级的开源WebGIS解决方案--MapGuide（介绍）
.MapGuide概述 MapGuide是Autodesk公司推出的在网络上发布空间数据的新一代Web GIS平台,为了促进开源Web GIS的发展,Autodesk公司推出了开源版的MapGuide ...
Autodesk Infrastructure Map Server(AIMS)/MapGuide API 培训材料--第1章
目录: Autodesk Infrastructure Map Server(AIMS)/MapGuide API 培训材料--第1章 Autodesk Infrastructure Map Serv ...
MapGuide 浏览器可接受参数分析
摘要: 这篇文章我们主要讲述如何通过阅读分析MapGuide的源代码对MapGuide浏览器所接受参数的分析. 如果你也正在困惑于MapGuide Ajax Viewer或者Fusion Viewer ...
MapGuide HTTP API
本节将介绍什么是HTTP API,HTTP API与MapGuide Web API的关系,以及如何使用HTTP API.一般情况下,我们并不需要使用HTTP API,而且Viewer API已经包装 ...
MapGuide 初步
今天,粗浅在研究了一下MapGuide,在此做个记号 MapGuide Open Source is a web-based platform that enables users to quickl ...
Mapguide配置心得
最近由于一个公交查询项目,一直在研究Mapguide开源版本,配置完成之后显示示例程序这个过程真是令人伤神伤力.终于有种感觉,开源的软件不是这么好用的啊. 现在把自己配置过程以及心得体会写出来跟大家交 ...

MapGuide Viewer

MapGuide Viewer相关推荐

最新文章

热门文章