一、加载地图控件和默认场景

发送反馈

概述

SceneControl 三维场景控件，主要用来浏览三维场景、进行动态飞行浏览、控制图层等三维操作的工作窗口。

一个三维场景控件（SceneControl）对应一个三维场景（Scene），即一个三维场景窗口中只能显示一个三维场景。

在本节内容主要展示了，如何加载三维场景控件，并且打开默认的三维场景。

SceneControl 三维场景控件结构图

Scene 三维场景结构图

SceneControl 常用属性

  接口 说明
layer3DServicesList 获取 SuperMap iServer 8C(2017) 服务端发布的三维图层集合服务列表。
asyncHelper 设置当前设置的异步助手。使得用户可以通过异步下载的方式获取场景服务中的图层。
scene 获取三维场景。一个三维场景控件中只支持一个三维场景，但是可以使用 scene 中 open 接口打开不同的 scene，在打开新场景前需要关闭旧场景。
sceneAction 获取或设置用户当前操作类型。
sceneServicesList 获取 SuperMap iServer 8C(2017)

SceneControl 常用方法

  接口 说明
addEvent 在地图控件中添加事件，将事件与回调函数 handler 绑定。即当 eventName 指定的事件发生时，完成 handler 回调函数的操作。
checkPluginVersion 判断当地控件版本是否为最新。若不是最新版本，则获取新版本的下载地址。
getPluginVersion 获取本地插件的版本号。
pixelToGlobe 将屏幕二维点 Point 转换成地理坐标系下的三维点 Point3D。
removeEvent 移除与事件绑定的指定回调函数 handler。
resetTerrain 重置地形图层。对地形图层进行增、删、可见不可见设置时都需要调用此函数刷新地形显示。
save 保存当前场景配置为 GML 标准的 XML 文件，并上传到服务器。
setRefreshRaster 设置实时栅格化是否刷新。在三维系统中如果出现栅格数据显示问题，可以调用该函数仅刷新栅格数据的显示。
viewEntire 全幅显示三维地图场景。

加载场景控件 SceneControl 和默认场景 Scene

  1. 在任意位置新建文件夹 “GettingStarted”，用户也可自定义该文件夹名字。

    将 “lib” 脚本库文件夹和 samplecode/samplecode 文件夹中的“images” 图片文件夹放入 “GettingStarted” 文件夹下。

  2. 在 “GettingStarted” 文件夹下创建一个名为 “Scripts” 的文件夹用于存放脚本文件。

    然后在 “Scripts” 下创建名为 “SuperMap.Include.js” 和 “GettingStarted.js” 两个脚本文件，其中 “GettingStarted.js” 文件实现具体的功能，“SuperMap.Include.js” 文件是代码库引用文件列表。需要注意的是两个 js 文件都需要保存为 UTF-8 格式。在“SuperMap.Include.js” 文件夹中添加以下代码：

    JavaScript 拷贝代码 
    function _IncludeScript(inc)
    {    
        //lib 中的脚本文件与引用 SuperMap.Include.js 文件的 html 页面的相对路径 “src="lib/'+inc+'"'+'”
        //如果用户将 lib 文件夹与引用 SuperMap.Include.js 文件的 html 页面没有放在同级文件夹目录下，则路径需要根据实际情况修改
  var script='<'+'script type="text/javascript" src="lib/'+inc+'"'+'><'+'/script>'; 
        document.writeln(script); 
}
if(!Function.__typeName)
    {    
        //框架脚本
  _IncludeScript('lib_Ajax/MicrosoftAjax.js');
        //SuperMap iClient 6R for Ajax 二维脚本库
  _IncludeScript('lib_Ajax/SuperMap.Web.js');
        //三维核心库
  _IncludeScript('lib_Realspace/SuperMap.Web.Realspace.js');
}
  3. 在 “GettingStarted” 文件夹下创建名为 “default.html” 的主页面，为了保持文件的一致性请将 “default.html”文件同样保存为 UTF-8 格式，然后在文件中添加如下代码：
    JavaScript 拷贝代码 
    <html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>SuperMap iClient 6R for 3D GettingStarted</title>    
<!--引用 SuperMap.Include.js，实现将 SuperMap.Include.js 中的库文件在该 html 中引用-->
<script type="text/javascript" src="Scripts/SuperMap.Include.js"></script>
<!--引用 GettingStarted.js，系统具体功能在该脚本中实现-->
<script type="text/javascript" src="Scripts/GettingStarted.js"></script>
    </head>
<body onLoad="onPageLoad()">    
<!--场景控件-->
 <div id="sceneControlDiv" style="position:relative; margin: 0; padding: 0; border: 1px solid black; z-index:1; 
       left: 0%; width: 100%; top: 0%; height: 95%; visibility: visible;background-image: images/logo.png;">
</div>
</body>
</html>
  4. 在 “GettingStarted.js” 文件中添入以下代码，实现默认场景的加载：
    JavaScript 拷贝代码 
    var scene = null;
    var sceneControl = null;
    var htmlUrl = document.location.host;    
//判断网页的打开方式是本地打开还是通过网络打开
//不同的打开方式 url 赋值不同
if(htmlUrl == "")
{       
        htmlUrl = "http://localhost:8090";
}
else
{
        htmlUrl = "http://" + htmlUrl;
}
function onPageLoad()
{
    try
    {
                //获取 html 页面中名为 sceneControlDiv 的 div 对象作为场景控件
        sceneControl = new SuperMap.Web.UI.Controls.SceneControl($get("sceneControlDiv"), initCallback, failedCallback);
        }
        catch(e)
        { 
                //若没有安装插件，则抛出该异常。
          if (e.name == SuperMap.Web.Realspace.ExceptionName.PlugInNotInstalled)
                {
                        var url = htmlUrl + "/SuperMapRealspace/SuperMap iClient 6R for Realspace.exe";
                        document.write("<a href='"+url+"'>请点击下载 SuperMapiClientForRealspace 插件进行安装</a>");
                        return;
                }
                //若使用非 IE 浏览器，则抛出该异常
          else if (e.name == SuperMap.Web.Realspace.ExceptionName.BrowserNotSupport)
                {
                        document.write("<p>SuperMap iClient 6R for 3D 目前只支持 IE 浏览器</p>");
                        return;
                }
                //抛出其他异常
                else
                {
                        alert(e.message);
                }
        }       
}
//控件初始化完成后的回调函数，初始化完成之后才能进行数据加载                         
function initCallback()
{
        //获取 3D 控件的场景，控件和场景是一对一关系
  scene = sceneControl.get_scene();
}  
//控件初始化失败后的回调函数
function failedCallback() 
{
  alert("Realspace initialized failed!");
}
  5. 运行 IE6 或以上浏览器，这时会弹出一个阻止文件显示的警告提示，单击右键选择 ”允许阻止的内容“ 即可。如图所示已经成功加载了地图控件和场景。
    地图控件和默认场景

    图1 加载地图控件和默认场景