运行范例

描述

该范例展示如何加载图片对象到屏幕图层,加载模型对象到跟踪图层,并对图片进行编辑。

代码 (文件格式为 UTF-8)


<html>
	<head>
        <meta http-equiv="x-ua-compatible" content="IE=8" />
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <meta http-equiv="x-ua-compatible" content="IE=10" />
		<title>编辑图片和添加模型</title>
		<script type="text/javascript" src="SuperMap.Include.js" ></script>
		<script type="text/javascript">
			var scene = null;
			var sceneControl = null;
			var modelLayer = null;
			var htmlUrl = document.location.host;
			//判断网页的打开方式是本地打开还是通过网络打开
			//不同的打开方式url赋值不同
			if(htmlUrl == "")
			{
				htmlUrl = "http://localhost:8090";
			}
			else
			{
				htmlUrl = "http://" + htmlUrl;
			}
			var sceneUrl = htmlUrl + "/iserver/services/3D-sample/rest/realspace";
			
			function onPageLoad() 
			{
				//初始化三维场景控件
				try
				{
					//初始化三维场景控件实例,参数为包含控件的HTML元素
					sceneControl = new SuperMap.Web.UI.Controls.SceneControl($get("sceneControlDiv"), initCallback, failedCallback);
				}
				catch(e)
				{   
					//若没有安装插件,则抛出该异常
					if (e.name == SuperMap.Web.Realspace.ExceptionName.PlugInNotInstalled) 
					{
						var url = htmlUrl + "/iserver/iClient/for3D/plugin/Setup.exe";
						document.write("<a href='"+url+"'>未检测到 SuperMap iClient3D for  Plugin 插件,请单击此处下载并安装插件。</a>");
						return;
					}
					//若使用非IE浏览器,则抛出该异常
					else if (e.name == SuperMap.Web.Realspace.ExceptionName.BrowserNotSupport) 
					{
						document.write("<p>SuperMap iClient3D for  Plugin 目前仅支持 InternetExplorer 浏览器,请更换浏览器后重新尝试加载本页面。</p>");
						return;
					}
					//抛出其他异常
					else
					{
						alert(e.message);
					}
				}
			}

			//控件初始化完成后的回调函数,初始化完成之后才能进行数据加载
			function initCallback() 
			{
				//获取Realspace控件的场景,控件和场景是一对一的捆绑关系
				scene = sceneControl.get_scene();
			}

			//控件初始化失败后的回调函数
			function failedCallback() 
			{
				alert("Realspace initialized failed!");
			}
	
			function pan()
			{  
				//切换漫游Action
				var panAction = new SuperMap.Web.UI.Action3Ds.Pan(sceneControl);
				sceneControl.set_sceneAction(panAction); 
			    
				//设置鸟巢模型图层为不可编辑
				if(modelLayer)
				{
					modelLayer.set_isEditable(false);  
				}            		  		
			}
           
			//添加图片到屏幕图层
			function addPicture3D() 
			{        
				//创建图片对象
				var pic = new SuperMap.Web.Core.GeoPicture3D();
				//指定图片的网络地址
				var style = new SuperMap.Web.Core.Style3D();
				var pictureurl = htmlUrl + "/RealspaceSample/iClient.png";
                pic.fromImageFile(pictureurl);
                
				//设置图片的大小和位置,屏幕图层有两种单位:像素和比例。这里以像素为单位
				pic.set_height(100);
				pic.set_width(100);
				pic.set_position(new SuperMap.Web.Core.Point3D(100, 100, 0));
                
				//屏幕图层中只能加feature3D,所以这里得把geometry构造成feature3D对象
				var feature3d = new SuperMap.Web.Core.Feature3D();
				feature3d.set_geometry(pic);
           		  
           		  
				var screenLayer = scene.get_screenLayer3D();
				//设置屏幕图层的单位为像素
				screenLayer.set_xUnit(SuperMap.Web.Realspace.ScreenCoordinateUnit.PIXEL);
				screenLayer.set_yUnit(SuperMap.Web.Realspace.ScreenCoordinateUnit.PIXEL);
				//设置屏幕图层可见
				screenLayer.set_isVisible(true);
				//将feature3D加入屏幕图层
				screenLayer.add(feature3d, "SuperMap");       
			}
           
			//编辑图片
			function EditPicture3D() 
			{		
				var screenLayer = scene.get_screenLayer3D();
				//设置“SuperMap”对象为选择可编辑状态
				screenLayer.setSelected("SuperMap",true);

				//设置控件的当前Action为Select
				var selectAction = new SuperMap.Web.UI.Action3Ds.Select(sceneControl);
				sceneControl.set_sceneAction(selectAction);          
			}
           
			//加载模型场景
			function addModel3D() 
			{		
				//获取三维图层信息列表对象实例
				var layer3DServicesList = sceneControl.get_layer3DServicesList();
				//从指定的服务器获取场景的图层服务信息,获取成功返回 True
				var bLoad = layer3DServicesList.load(sceneUrl, "scene");
				
				if(bLoad)
				{
					var layer3DServiceInfo = layer3DServicesList.get_item("Building@OlympicGreen");
					var dataName = layer3DServiceInfo.get_dataName();
					//加载鸟巢场景
					modelLayer = scene.get_layer3Ds().add(sceneUrl, "Building@OlympicGreen", dataName, SuperMap.Web.Realspace.Layer3DType.VECTOR);			    

					scene.get_flyingOperator().flyToBounds(modelLayer.get_bounds());
				}
				else
				{
					alert("获取图层服务信息失败!");
				}
			}
           
			//编辑模型
			function EditModel3D() 
			{    
				//设置鸟巢模型图层为可编辑
				modelLayer.set_isEditable(true);  
                	
				//设置控件的当前Action为Select
				var selectAction = new SuperMap.Web.UI.Action3Ds.Select(sceneControl);
				sceneControl.set_sceneAction(selectAction);                 
			}
		</script>
	</head>

	<body onLoad="onPageLoad()" >
	    <div div id="toolSet" style="position:absolute;top:5px;height:25px;width:100%;float: left">
	    <input type="button" name="pan" value = "漫游" onclick="pan()" style="position:absolute;left:20px;width:80px;height:50px"/>
	    <input type="button" name="AddPicutre" value = "添加图片" onclick="addPicture3D()" style="position:absolute;left:105px;width:80px;height:50px"/>
	    <input type="button" name="EditPicture" value = "编辑图片" onclick="EditPicture3D()" style="position:absolute;left:190px;width:80px;height:50px"/>
	    <input type="button" name="AddPicutre" value = "添加模型" onclick="addModel3D()" style="position:absolute;left:280px;width:80px;height:50px"/>
	   
	    </div>
	    <div id="sceneControlDiv" style="position:absolute;top:30px;left:5px;bottom:5px;right: 5px;width:100%;float=left">
	    </div>
	</body>

</html>