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

发布时间 2023-08-15 20:01:35作者: 且行且思
通过实例说明如何在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 οnlοad="Init()">
    <input type="button" value="创建圆"  οnclick="CreateCircle()"/>
    <input type="button" id="btnCreateTextLabel" value="创建文字" οnclick="CreateTextLabel()"/>
    <input type="button" id="btnCreatePolygon" value="创建多边形" οnclick="CreatePolygon()" />
    <input type="button" id="btnComplexPolygon" value="复杂多边形" οnclick="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);
    }
}