cccreator / GIS

Gis releated
1 stars 0 forks source link

Direction Angle Calculate And Application #9

Open cccreator opened 5 years ago

cccreator commented 5 years ago

方向角的计算(这是js,转java也很方便)

不知道别的GIS API的方向是怎么算的,对于Arcgis API是水平方向顺时针方向角度越来越大,例如:水平向右方向逆时针向上第一象限为负角度。

app.getAngle = function(startx, starty, endx, endy) {
var diff_x = endx - startx;
var diff_y = endy - starty;
var a = Math.abs(diff_x);
var b = Math.abs(diff_y);
var angle = 360 * Math.atan(a / b) / (2 * Math.PI);
if(diff_x > 0 && diff_y > 0){
return angle - 90;
}else if(diff_x < 0 && diff_y > 0){
return 270 - angle;
}else if(diff_x < 0 && diff_y < 0){
return 90 + angle;
}else if(diff_x > 0 && diff_y < 0){
return 90 - angle;
}else if(diff_x > 0 && diff_y == 0){
return 0;
}else if(diff_x < 0 && diff_y == 0){
return 180;
}else if(diff_x == 0 && diff_y > 0){
return 270;
}else if(diff_x == 0 && diff_y < 0){
return 90;
}
};

Math.atan(a / b)得到的弧度,然后除以2π乘以36度,就能得到角度;

cccreator commented 5 years ago

小车移动更新定位点(带方向)

            app.updateTrailForAchieveBus = function (playi) {
                //清除悬浮框
                if (dojo.byId("waveText") != null) { //如果存在对应id的div
                    dojo.byId("gis_Map").removeChild(dojo.byId("waveText")); //删除div
                }
                // app.waveLayer.clear(app.graphicw); //清除上一次位置的波元素
                app.waveForBusLayer.clear(app.graphicw);
                //设置坐标
                //图片根据划线点的坐标,重新走一下图片。
                var ppw = new esri.geometry.Point(app.playpath[playi][0], app.playpath[playi][1]);

                var angle = app.getAngle(app.playpath[playi][0], app.playpath[playi][1],app.playpath[playi+1][0], app.playpath[playi+1][1]);**
                //var ptw = new esri.geometry.geographicToWebMercator(ppw);
               //设置图像
                var symbolw = new esri.symbol.PictureMarkerSymbol(mapConfig.busTrackPlay, mapConfig.playWaveSize, mapConfig.playWaveSize);
                symbolw.setAngle(angle);
                app.graphicw = new esri.Graphic(ppw, symbolw, {routeName: app.playpath[playi][2], carNo: app.playpath[playi][3], actTime: app.playpath[playi][4], speed: app.playpath[playi][5],gpsmile:app.playpath[playi][6]}); //波对象

                app.waveForBusLayer.add(app.graphicw); //波对象添加到图层
                app.map.addLayer(app.waveForBusLayer); //图层添加到地图

            };
cccreator commented 5 years ago

在线路轨迹上标注方向箭头

        //历史轨迹上画上箭头:获取方向角选择一定间隔打上箭头图片
         app.addArrowOnLine = function () {
                for(var j=0;j< app.playpath.length;j++){
                    var pp = new esri.geometry.Point(app.playpath[j][0], app.playpath[j][1]);
                    var angle = app.getAngle(app.playpath[j][0], app.playpath[j][1],app.playpath[j+1][0], app.playpath[j+1][1]); //获取方向角
                    var symbolArrow = new esri.symbol.PictureMarkerSymbol(/*mapConfig.routeArrow*/"", mapConfig.playWaveSize, mapConfig.playWaveSize);
                    symbolArrow.setAngle(angle); //设置方向角
                    if(j%60 == 0){ //设置两个箭头的间隔
                        app.graphicArrow = new esri.Graphic(pp, symbolArrow);
                        app.arrowOnLineLayer.add(app.graphicArrow);
                    }
                }
                app.map.addLayer(app.arrowOnLineLayer); //图层添加到地图
            }
cccreator commented 5 years ago

实现小车在屏幕地图范围内移动,超出范围就移到屏幕中央

//更新定位点

           app.updateBusTrail = function (playi) {
                //清除悬浮框
                if (dojo.byId("waveText") != null) { //如果存在对应id的div
                    dojo.byId("gis_Map").removeChild(dojo.byId("waveText")); //删除div
                }
                app.waveLayer.clear(app.graphicw); //清除上一次位置的波元素
                //设置坐标
                //图片根据划线点的坐标,重新走一下图片。
                var ppw = new esri.geometry.Point(app.playpath[playi][0], app.playpath[playi][1]);
                var xmaxTrue = app.map.extent.xmax;
                var screenWidth = $(window).width();
                var ratio = 350/(parseFloat(screenWidth)- 35);
                var xmin = app.map.extent.xmin;
                var xmax = parseFloat(xmaxTrue)-(parseFloat(xmaxTrue) - parseFloat(xmin))*ratio;
                var ymax = app.map.extent.ymax;
                var ymin = app.map.extent.ymin;

                if(app.playpath[playi][0] < xmin || app.playpath[playi][0] > xmax || app.playpath[playi][1] < ymin || app.playpath[playi][1] > ymax){
                    app.map.centerAndZoom(ppw);
                }

                var angle = app.getAngle(app.playpath[playi][0], app.playpath[playi][1],app.playpath[playi+1][0], app.playpath[playi+1][1]);
                //var ptw = new esri.geometry.geographicToWebMercator(ppw);
                if(mapConfig.cityCode == "SZ"){
                    //设置图像
                    var symbolw = new esri.symbol.PictureMarkerSymbol(mapConfig.busTrackPlay, mapConfig.playWaveSize, mapConfig.playWaveSize);
                    symbolw.setAngle(angle);
                }else{
                    //设置图像
                    var symbolw = new esri.symbol.PictureMarkerSymbol(mapConfig.wave, mapConfig.playWaveSize, mapConfig.playWaveSize);
                }

                app.graphicw = new esri.Graphic(ppw, symbolw, {routeName: app.playpath[playi][2], carNo: app.playpath[playi][3], actTime: app.playpath[playi][4], speed: app.playpath[playi][5],gpsmile:app.playpath[playi][6]}); //波对象

                app.waveLayer.add(app.graphicw); //波对象添加到图层
                app.map.addLayer(app.waveLayer); //图层添加到地图

            };