动态旋转Google Maps Maker图标

时间:2019-04-20 21:51:27

标签: jquery asp.net ajax google-maps

我正在开发一个在Google地图中动态显示标记的系统,标记将代表移动的车辆。每辆车都有一个GPS追踪器,它将位置(纬度,经度)发送到数据库,并使用我当前的代码显示车辆的最后位置并在地图上显示(尽管所有其他位置仍被存储)

<div id="map"></div>
<script>
        var map;
        var marker = [];
        function initMap() {
            map = new google.maps.Map(document.getElementById('map'), {
                center: { lat: 25.735042, lng: -80.334563 },
                zoom: 15
            });

            $.get("@Url.Action("GetAllLocation","Home")", function (data, status) {/*Get the data from database in asp.net mvc*/

                var contentInfo = [];
                var infowindow = [];
                for (var i = 0; i < data.length; i++) {
                    var iconImage = data[i].Rating == 1 ? "../Icons/icons8-hyundai-50.png" : data[i].Rating == 2 ? "../Icons/icons8-kia-50.png" : data[i].Rating == 3 ? "../Icons/icons8-mazda-50.png" : "../Icons/icons8-vado-50.png"
                    marker[i] = new google.maps.Marker({
                        position: { lat: data[i].lat, lng: data[i].long },
                        map: map,
                        icon: iconImage
                    });

                    contentInfo[i] = '<div id="content">' +
                        '<div id="siteNotice">' +
                        '</div>' +
                        '<h1 id="firstHeading" class="firstHeading">'
                        '<div id="bodyContent">' +
                        '<p><b>Lat:' + data[i].lat + ', Long:' + data[i].long;

                    infowindow[i] = new google.maps.InfoWindow({
                        content: contentInfo[i]
                    });
                }
            })
        }

    </script>

使用此代码,我可以在地图上显示每辆车的位置,并根据情况为每个位置提供不同的图标。在此之前,一切都很好,但是我现在要做的是根据当前位置和先前位置旋转地图上每辆车的图标。我想要一个通过传递两个位置来完成这项工作的函数。

0 个答案:

没有答案