Google Maps谷歌地图车辆位置描点、位置详情查看

根据经纬度、方位角渲染位置点图标（黄色图标为车辆在线、灰色图标为车辆离线） ；点击车辆具体图标可查看速度、海拔、平均油耗、定位时间以及定位地点（调用阿里云逆地理编码接口，将经纬度转换为详细结构化的地址）

 

map = new google.maps.Map(document.getElementById('map'), {
        // zoom 属性指定了地图的 缩放级数
        zoom: 4,
        // 起始位置
        center: new google.maps.LatLng(34.31229993, 108.76148126),
        // 免摁Ctrl键缩放
        gestureHandling: 'greedy',
        // 地图的初始化类型
        mapTypeId: google.maps.MapTypeId.HYBRID,
        // 比例尺
        scaleControl: true
    });

$.each(JSON.parse(results.msg), function (index, row) {
            // 车辆icon
            var iconk = "info" + index;
            // 判断车辆状态（0在线 1离线）
            if (row.status == 0) {
                // 记录在线车辆总数
                onlineVehicle += 1;
                // 在线车辆
                iconlist[iconk] = {name: iconk, icon: iconBaseOnline + row.angle + ".png"};
            } else {
                // 离线车辆
                iconlist[iconk] = {name: iconk, icon: iconBaseOffline + row.angle + ".png"};
            }
            // 车辆位置坐标点、图标、海拔、车架号
            printList.push({lat: row.y, lng: row.x, type: $.trim(iconk), elevation: row.hb, tboxVin: row.uid});
        });

        // 渲染位置点、图标
        var markers = printList.map(function (location, i) {
            var clickMarker = new google.maps.Marker({
                position: location,
                icon: iconlist[location.type].icon
            });

            clickMarker.addListener('click', function () {
                infowindow.open(map, clickMarker);
            });

            return clickMarker;
        });

        var markerCluster = new MarkerClusterer(map, markers,
            {imagePath: '../img/m'});
    });