通过实例说明如何在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
[/span>html xmlns=""
[/span>head
[/span>meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
[/span>title
[/span>script src="tools.js"
[/span>body οnlοad="Init()"
[/span>input type="button" value="创建圆" οnclick="CreateCircle()"/>
[/span>input type="button" id="btnCreateTextLabel" value="创建文字" οnclick="CreateTextLabel()"/>
[/span>input type="button" id="btnCreatePolygon" value="创建多边形" οnclick="CreatePolygon()" />
[/span>input type="button" id="btnComplexPolygon" value="复杂多边形" οnclick="ComplexPolygon()" />
[/span>div
[/span>object id="TE" classid="clsid:3a4f9192-65a8-11d5-85c1-0001023952c1" style="width: 600px;height: 600px"
[/span>object id="sgworld" classid="CLSID:3a4f9197-65a8-11d5-85c1-0001023952c1" style="visibility:hidden;height:0 "
[/span>script language="javascript"
function Init() {
sgworld.Project.Open("SkylineGlobe.tbp@tglobe.skylinesoft.com");
}
(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;
//代码效果参考:http://www.zidongmutanji.com/zsjx/356677.html
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;
//代码效果参考:http://www.zidongmutanji.com/zsjx/252899.html
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的知识,可参考
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);
}
}