xuhy
2025-01-14 a50197bd1a429d903718e40b54685bb2a241bd4a
ManagementOKTravel/guns-admin/src/main/webapp/static/modular/system/tOrderTaxi/tOrderTaxi_info.js
@@ -125,157 +125,11 @@
    ajax.start();
}
var map = new BMapGL.Map('allmap', {
    style: 'grayed-out',
    displayOptions: {
        indoor: false,
        poiText: false,
        poiIcon: false,
        building: false,
    }
var map = new AMap.Map("container", {
    resizeEnable: true,
    zoom: 14
});
var point = new BMapGL.Point(demo_data[0][0], demo_data[0][1]);
map.centerAndZoom(point, 18);
map.enableScrollWheelZoom(true);
map.setTilt(35);
var track = new Track.View(map, {
    lineLayerOptions: {
        style: {
            strokeWeight: 8,
            strokeLineJoin: 'round',
            strokeLineCap: 'round'
        },
    }
});
var trackData = [];
var colorOffset = [];
function orderTrack(data) {
    for(var item in data){
        var point = new BMapGL.Point(data[item].lon, data[item].lat);
        var trackPoint = new Track.TrackPoint(point);
        trackData.push(trackPoint);
        // 不同速度区间对应颜色
        var choose = [0.9, 0.5, 0.1];
        var color = choose[Math.floor(Math.random() * choose.length)];
        colorOffset.push(color);
    }
}
var startMarker = new BMapGL.Marker(trackData[0].getPoint(), {
    icon: new BMapGL.Icon('https://mapopen-pub-jsapi.bj.bcebos.com/jsapiGlgeo/img/start.png', new BMapGL.Size(25, 40)),
    offset: new BMapGL.Size(0, -16),
});
map.addOverlay(startMarker);
var endMarker = new BMapGL.Marker(trackData[trackData.length-1].getPoint(), {
    icon: new BMapGL.Icon('https://mapopen-pub-jsapi.bj.bcebos.com/jsapiGlgeo/img/end.png', new BMapGL.Size(25, 40)),
    offset: new BMapGL.Size(0, -16),
});
map.addOverlay(endMarker);
var duration = 60000;
var step = duration / trackData.length;
var trackRoad = new Track.LiveTrack({
    // visible: false,
    duration: step,
    linearTexture: [[0, '#f45e0c'], [0.5, '#f6cd0e'], [1, '#2ad61d']],
    guideStyle: {
        style:{
            traceDisappear: false,
            traceStart: true,
            sequence: true,
            marginLength: 32,
            arrowColor: '#fff',
            strokeColor: 'rgba(27, 142, 236, 1)',
            strokeTextureUrl: 'https://mapopen-pub-jsapi.bj.bcebos.com/jsapiGlgeo/img/down.png',
            strokeTextureWidth: 64,
            strokeTextureHeight: 32,
        }
    },
});
trackRoad.setGuidTrackPath(trackData);
trackRoad.on(Track.LineCodes.GUIDE_STATUS, (e) => {
    if (e.status === Track.GuidCodes.ADD_TO_MAP) {
        var guidTrack = trackRoad.getGuidTrack();
        guidTrack.on(Track.LineCodes.STATUS, (status) => {
            switch (status) {
                case Track.StatusCodes.FINISH:
                    var box = trackRoad.getBBox();
                    if(box){
                        var bounds = [new BMapGL.Point(box[0], box[1]), new BMapGL.Point(box[2], box[3])];
                        map.setViewport(bounds);
                    }
                    break;
                default:
                    break;
            }
        });
    }
});
var movePoint = new Track.ModelPoint({ point: trackData[0].getPoint(), style:{
        url: 'https://mapopen-pub-jsapi.bj.bcebos.com/jsapiGlgeo/img/bus.glb',
        scale: 9,
        level: 18,
        rotationX: 90,
        rotationY: 90,
        rotationZ: 0
    } });
movePoint.setRotation(trackRoad.getGuidTrack().getStepInfoByIndex(0).angle);
trackRoad.setMovePoint(movePoint);
track.addTrackLine(trackRoad);
track.focusTrack(trackRoad);
var ani;
var start = null;
var index = 0;
var finishIndex = 0;
function startAnimation(timestamp) {
    if (!start) start = timestamp;
    var progress = timestamp - start;
    var next = step * (index - finishIndex);
    if(progress > next){
        if(index<trackData.length){
            movePoint.moveTo(trackData[index]);
            var obj = trackRoad.getGuidTrack().getStepInfoByIndex(index);
            trackRoad.setGradientColors(colorOffset.slice(0,index+1));
            index++;
        }else{
            pauseAnimation();
        }
    }
    ani = requestAnimationFrame(startAnimation);
}
function stopAnimation() {
    pauseAnimation();
    index = 0;
    finishIndex = index;
    start = null;
    trackRoad.clearTrackPoint();
    movePoint.setPoint(trackData[0].getPoint());
    movePoint.setRotation(trackRoad.getGuidTrack().getStepInfoByIndex(0).angle);
}
function pauseAnimation() {
    cancelAnimationFrame(ani);
    finishIndex = index;
    start = null;
}
function resumeAnimation() {
    startAnimation();
}
$(function() {
    $('#orderType').on('change', function () {
        if($(this).val() == 1){
@@ -311,4 +165,68 @@
    });
}
var marker, lineArr = [];
function orderTrack(data) {
    for(var i in data){
        var waypoints = [];
        var lon = parseFloat(data[i].lon);
        var lat = parseFloat(data[i].lat);
        waypoints.push(lon);
        waypoints.push(lat);
        lineArr.push(waypoints);
    }
    marker = new AMap.Marker({
        map: map,
        position: lineArr[0],
        icon: "https://webapi.amap.com/images/car.png",
        offset: new AMap.Pixel(-26, -13),
        autoRotation: true,
        angle:-90,
    });
    // 绘制轨迹
    var polyline = new AMap.Polyline({
        map: map,
        path: lineArr,
        showDir:true,
        strokeColor: "#28F",  //线颜色
        // strokeOpacity: 1,     //线透明度
        strokeWeight: 6,      //线宽
        // strokeStyle: "solid"  //线样式
    });
    var passedPolyline = new AMap.Polyline({
        map: map,
        // path: lineArr,
        strokeColor: "#AF5",  //线颜色
        // strokeOpacity: 1,     //线透明度
        strokeWeight: 6,      //线宽
        // strokeStyle: "solid"  //线样式
    });
    marker.on('moving', function (e) {
        passedPolyline.setPath(e.passedPath);
    });
    map.setFitView();
}
function startAnimation () {
    marker.moveAlong(lineArr, 200);
}
function pauseAnimation () {
    marker.pauseMove();
}
function resumeAnimation () {
    marker.resumeMove();
}
function stopAnimation () {
    marker.stopMove();
}