Syline6.5学习心得-web-创建几何对象

来源:互联网 发布:ps4实况2018网络对战 编辑:程序博客网 时间:2024/06/03 20:33

通过实例说明如何在Skyline中创建圆、文本、多边形等几何要素,设置要素的颜色,要素提示,飞行到几何要素等功能。

1.使用的接口

  •  ICreator65:可以创建几何要素、颜色、位置、图层等等(具体请查看api)例如本篇所涉及的要素:CreatePosition, CreateColor, CreateCircle, CreateMessage;
  • INavigate65:导航接口,可以获取设置相机位置信息,飞行到某个坐标点、放大、缩小、飞行控制等,这里主要使用的方法有:FlyTo(pos) 飞行到某个位置;
  •  IPosition65:位置接口,提供创建位置信息、相机位置信息,这里使用的方法有:Copy() 复制位置, Pitch 相机俯角设置(具体请参加api Basic Concepts 一项);
  •  IColor65:颜色接口,采用rgba;
  • IGeometryCreator :创建线、面几何地物,这里使用的有: CreateLinearRingGeometry(线地物), CreatePolygonGeometry(面地物);

未列出方法,请参考api。

2.程序设计

(1)新建js文件名为tools;

(2)添加引用到index.html;

(3)添加相应的按钮;

完整代码如下:

(4)html代码

<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>    <title>skyline实例</title>    <script src="tools.js"></script></head><body onload="Init()">    <input type="button" value="创建圆"  onclick="CreateCircle()"/>    <input type="button" id="btnCreateTextLabel" value="创建文字" onclick="CreateTextLabel()"/>    <input type="button" id="btnCreatePolygon" value="创建多边形" onclick="CreatePolygon()" />    <input type="button" id="btnComplexPolygon" value="复杂多边形" onclick="ComplexPolygon()" />    <div>    <!-- Define a div element that will hold a TerraExplorer ActiveX object-->    <object id="TE" classid="clsid:3a4f9192-65a8-11d5-85c1-0001023952c1" style="width: 600px;height: 600px"></object>    <!--Define an object element that will allow you access to TerraExplorer v6.5 API.-->    <object id="sgworld" classid="CLSID:3a4f9197-65a8-11d5-85c1-0001023952c1" style="visibility:hidden;height:0 "></object> </div>    <script language="javascript" >        function Init() {            sgworld.Project.Open("SkylineGlobe.tbp@tglobe.skylinesoft.com");        }    </script></body></html>

(5)tools.js代码

//创建圆function CreateCircle() {    try {        var sgworld=document.getElementById('sgworld');        //创建圆的位置        var dxCoord = -122.49460;        var dyCoord = 37.78816;        //注:以实际地面高度创建圆面的高度,创建后的圆面不一定是平的        var dAltitude = 100;//当地地面高程        //轴心点离地面高度        var eAltitudeTypeCode = 0;//AltitudeTypeCode.ATC_TERRAIN_RELATIVE;        //相机角度设置        var dYaw = 0.0;        var dPitch = 0.0;        var dRoll = 0.0;        var dDistance = 5000;        var cPos = sgworld.Creator.CreatePosition(dxCoord, dyCoord, dAltitude,            eAltitudeTypeCode, dYaw, dPitch, dRoll, dDistance);        //创建填充色        //argb        var cFillColor = sgworld.Creator.CreateColor(0, 255, 0, 0x7F);        //创建圆        var nLineColor=0xFFFF0000;//蓝色        var dCircleRagius = 200;//半径 单位 m        var groupID = "";        var descrition = "Circle";        var cCircle = sgworld.Creator.CreateCircle(cPos, dCircleRagius,            nLineColor, cFillColor, groupID, descrition);        //获取并设置圆的属性        //半径        var dNewCircleRadius = 300;        var dCurrentCircleRadius = cCircle.Radius;        cCircle.Radius = dNewCircleRadius;        //填充颜色        var nRGB_Red = 0xFF0000;        var dAlpha = 0.2;        var cFillStyle = cCircle.FillStyle;        cFillStyle.Color.FromRGBColor(nRGB_Red);        cFillStyle.Color.SetAlpha(dAlpha);        //向圆添加消息        var eMsgClient = 5;        var tMessage = "Hello Circle(你好)";        var eMsgType = 0;        var bIsBringToFront = true;        var cMsg = sgworld.Creator.CreateMessage(eMsgClient, tMessage, eMsgType, bIsBringToFront            );        cCircle.Message.MessageID = cMsg.ID;        //飞到圆        var flyPos = cPos.Copy();        flyPos.Pitch = -89;//俯角 89度        sgworld.Navigate.FlyTo(flyPos);    }    catch (e) {        alert("创建失败:" + e.message);    }}//创建文字function CreateTextLabel() {    try {        //获取skyline globe world 控件        var sgWorld=document.getElementById('sgworld');        //位置        var pos = sgWorld.Creator.CreatePosition(-122.49460, 37.78819, 100.0,//地理坐标信息            0,            0, 0, 0, 500);//相机角度位置参数                //文字样式        var labelStyle = sgWorld.Creator.CreateLabelStyle();        //设置样式参数        var backgroundColor = labelStyle.BackgroundColor;        backgroundColor.FromRGBColor(0xFF0000);//blue        backgroundColor.SetAlpha(0.5);        labelStyle.BackgroundColor = backgroundColor;        labelStyle.FontName = "Arial";        labelStyle.Italic = true;        labelStyle.Scale = 3;        var text = "Skyline Samples HZY";        var textLabel = sgWorld.Creator.CreateTextLabel(pos, text, labelStyle, "", "TextLabel");        //飞到文字标识        var flyToPos = pos.Copy();        flyToPos.Pitch = -89.0;        sgWorld.Navigate.FlyTo(flyToPos);        }    catch (e) {        alert("创建文字失败:" + e.message);    }}//创建多边形function CreatePolygon() {    try {        var sgworld=document.getElementById('sgworld');        //顶点        var verticesArray = [        -122.415025, 37.76059, 10,        -122.415868, 37.760546, 11,        -122.415922, 37.761244, 12,        -122.415592, 37.761254, 13,        -122.415557, 37.760973, 14,        -122.415081, 37.76099, 15        ];        //轮廓线        var ring = sgworld.Creator.GeometryCreator.CreateLinearRingGeometry(verticesArray);        //创建多边形地物        //第二个参数为内环顶点轮廓线        var polygonGeometry = sgworld.Creator.GeometryCreator.CreatePolygonGeometry(ring, null);        //创建多边形        var lineColor = 0xFF00FF00;        var fillColor = 0x7FFF0000;        var altitudeTypeCode = 0;        var newPolygon = sgworld.Creator.CreatePolygon(polygonGeometry, lineColor, fillColor,            altitudeTypeCode, "", "polygon");        //飞行到地物        var flypos = newPolygon.Position.Copy();            flypos.Pitch = -89.0;        //获取的相机的高度为-1,所以此时应该设置相机的高度        flypos.Distance = 500;        sgworld.Navigate.FlyTo(flypos);        }    catch (e) {        alert("创建多边形失败:" + e.message);    }   }//复杂多边形function ComplexPolygon() {    try {        var sgworld = document.getElementById('sgworld');        //通过WKT(well-known-text)创建带孔的多边形        //有关WKT的知识,可参考http://www.cnblogs.com/tiandi/archive/2012/07/18/2598093.html        var complexGeometry = sgworld.Creator.GeometryCreator.CreateGeometryFromWKT(            "POLYGON((-80.900091 26.739261,-80.906338 26.840896,-80.591731 26.951601,-80.809248 26.716679,-80.900091 26.739261),(-80.873569 26.819371,-80.81616 26.772908,-80.811242 26.846308,-80.873569 26.819371))"            );        //创建多边形        var lineColor = sgworld.Creator.CreateColor(255, 0, 0, 0);        var fillColor = "#00ff00";        var polygon1 = sgworld.Creator.CreatePolygon(complexGeometry, lineColor, fillColor,            2,/*AltitudeTypeCode.ATC_ON_TERRAIN (效果:在地面上,贴在地面上)*/            "", "Polygon with hole");        //通过坐标创建多个多边形        //外环线        var exteriorRing = sgworld.Creator.GeometryCreator.CreateLinearRingGeometry([            -80.593456, 26.692189, 1000,            -80.569379, 26.654723, 2000,            -80.482195, 26.724591, 1000,            -80.55208, 26.771137, 1000]);        //内环线1        var interiorRing1 = sgworld.Creator.GeometryCreator.CreateLinearRingGeometry([            -80.577327, 26.713192, 1000,            -80.567401, 26.726351, 1000,            -80.569138, 26.705869, 1000]);        //内环线2        var interiorRing2 = sgworld.Creator.GeometryCreator.CreateLinearRingGeometry([            -80.55315, 26.691784, 2000,            -80.555867, 26.673088, 2000,            -80.5252610, 26.688447, 2000]);        var complexGeometry2 = sgworld.Creator.GeometryCreator.CreatePolygonGeometry(exteriorRing, [interiorRing1, interiorRing2]);        var fillColor2 = "#0000ff";        var lineColor2 = "#00ff00";        var polygon2 = sgworld.Creator.CreatePolygon(complexGeometry2, lineColor2, fillColor2,            3,//AltitudeTypeCode.ATC_TERRAIN_ABSOLUTE(面的高度与地面的关系为绝对值,效果:面在自定义高度,但面不根据地形高低变化,只与顶点有关)            "", "Polygon with 2 holes");        polygon2.Position.Distance = 80000;        polygon2.Position.Pitch = -80;        sgworld.Navigate.FlyTo(polygon2.Position);    }    catch (e) {        alert("创建多边形失败:" + e.message);    }}
3.效果

(1)创建面和文本,点击面会有提示信息。

(2)创建复杂多边形

(3)创建简单多边形,顺序有点反了,看官见谅。




0 0
原创粉丝点击