Cesium earthSD實現相機飛行動畫

cesium+earthsd實現相機飛行動畫

效果：

原理：1.通過earthsdk將在兩個點之間畫出飛線，得到飛線點集資料

2.通過飛線點集資料，計算出每個點上的攝像機方向，得到攝像機方向集合

注意：在經過經度180度線的時候，會有攝像機反向問題，需特別處理　

3.將飛線點集資料和攝像機方向集合生成  path  物件，完成攝像機貼線飛行

4.在飛線路徑外圍新增 polylinevolume 管道物件達成效果

注意：當管道長度很長的時候，中間會出現管道扭曲，未找到原因。

解決辦法：將飛線沒兩個點拆成乙個線段建立多個管道。由於entityid不能重複，所以需要使用 customdatasource 建立實體集合

**：呼叫：

createcamerafollow(item)

init() )

},startup() //',
srccoordtype: 'wgs84',
dstcoordtype: 'wgs84'}}}
}]}var tileset =earth.scenetree.$refs.tileset.czmobject
},

//

建立相機跟隨
createcamerafollow(line) 
var p1 =[[[
this.dtor(line.srciplon * 1), this.dtor(line.srciplat * 1), 0],
[this.dtor(line.cluelon * 1), this.dtor(line.cluelat * 1), 0]]];
//獲取飛行距離
//let distance = this.getdistance(p1[0])
let parms =[
this.rtod(p1[0][0][0]),
this.rtod(p1[0][0][1]),
this.rtod(p1[0][1][0]),
this.rtod(p1[0][1][1]),
]let distance = this
.getflatterndistance(...parms)
//獲取飛線路徑
let flyline = this.getflyline(this
._earth, p1)
//新增管道
this.createcylinder(this
._earth, flyline)
//攝像機貼線飛行
settimeout(() =>, 100)
},//攝像機貼線飛行
camerafly (flyline, distance) 
}this
._earth.scenetree.root.children.push(leafconfig)
var path1 = this
._earth.scenetree.$refs.path1.czmobject;
path1.show = false; //
是否顯示
path1.currentspeed = (distance)/5; //執行速度
path1.currentd = 1; //
當前位置，單位公尺
path1.cameraattached = true; //
繫結相機
path1.playing = true; //
飛行//
path1._currentposition = true; // 飛行
path1.preupdateevalstring =`
if (p.currentd === 0) 
`;//定義乙個pin用來跟蹤路徑
//const pin = new xe.obj.pin(this._earth);
'position', path1, 'currentposition');
}, 
//新增管道-圓柱形-三角柱
createcylinder(earth, line) 
viewer.entities.add(})}
for(let item of line)
//將飛線每兩個點處理成一條線段
let line1 =json.parse(json.stringify(line))
let linearr =
for (let i in
line1) 
}//兩種顏色交替材質
/*var stripematerial = new cesium.stripematerialproperty();
*/var stripematerial = new
cesium.imagematerialproperty();
//計算圓
function
computecircle(radius) 
return
positions;
}//計算稜柱 arms 稜柱角的數量 router 外角突出距離 rinner 內角收縮距離
function
computestar(arms, router, rinner) 
return
positions;
}//建立實體集合
var datasource = new cesium.customdatasource('lines');
viewer.datasources.add(datasource);
for (let i=0; i< linearr.length;i++) ,
});}
},//清除管道和攝像機繫結
clearcylinder(earth),

//

建立飛線 - 返回飛線點資料集合 -earthsdk方法
getflyline(earth, data) );
return
poss;
});return positionscollection[0]
},//計算攝像機角度陣列 -- 忽略俯仰角面對映 line:線路徑
countrotations(line) )
//計算偏航角
function
counthornx(point1, point2) 
else
if ((y1 > 0 && y0 > 0) || (y1<0 && y0 < 0)) 
else
a =math.atan2(x,y);
return
a }
//計算俯仰角
function
counthorny(point1, point2) 
//計算rotations
let rotations =
for (let i = 0; i < l.length - 1; i++) 
rotations.push(rotations[rotations.length - 1])
return
rotations
},//獲取兩點間的距離
getflatterndistance(lat1,lng1,lat2,lng2)
var f = getrad((lat1 + lat2)/2);
var g = getrad((lat1 - lat2)/2);
var l = getrad((lng1 - lng2)/2);
var sg =math.sin(g);
var sl =math.sin(l);
var sf =math.sin(f);
vars,c,w,r,d,h1,h2;
var a =earth_radius;
var fl = 1/298.257;
sg = sg*sg;
sl = sl*sl;
sf = sf*sf;
s = sg*(1-sl) + (1-sf)*sl;
c = (1-sg)*(1-sl) + sf*sl;
w = math.atan(math.sqrt(s/c));
r = math.sqrt(s*c)/w;
d = 2*w*a;
h1 = (3*r -1)/2/c;
h2 = (3*r +1)/2/s;
return d*(1 + fl*(h1*sf*(1-sg) - h2*(1-sf)*sg));
},//度轉弧度
dtor(val) ,
//弧度轉度
rtod(val) ,
//公尺轉為度
mtod(val) ,
//公尺轉為度
dtom(val) ,
//弧度轉公尺
rtom (val) 

快速排序演算法實現（遞迴實現 棧實現）

基本思想 選擇乙個基準元素,比如選擇最後乙個元素,通過一趟掃瞄，將待排序列分成兩部分,一部分比基準元素小,一部分大於等於基準元素,此時基準元素在其排好序後的正確位置，又稱為軸位置，此位置的元素確定後不再參與排序，然後再用同樣的方法遞迴地排序劃分的兩部分。分析 快速排序是不穩定的排序。快速排序的時間複...

介面實現與配置實現

在實現系統功能的時候，通常會首先定義好功能的介面，在系統功能不斷被實現的過程中，慢慢的發現有些介面的實現很類似，這個時候通常會開始做一次抽象，形 成乙個共同的部分，慢慢的系統形成了乙個抽象的層次，而為了通用，通常是通過定義介面，形成乙個抽象類，抽象類中暴露出一些抽象方法供外部擴充套件實 現，逐步的積...

js分頁實現，前端實現。

主要是借鑑了網上乙個例子，自己重新加了樣式，新增了跳轉，修改了一些小地方，用於和大家一起分享，前端分頁的技巧，的資料是我已經寫好了，其實大家也可以前端渲染 然後再分頁，都是可以的。其實分頁最關鍵是這兩句 var startrow currentpage 1 pagesize 1 currentpag...