在谷歌地图上移动图像角度方向

时间:2016-09-23 11:38:37

标签: javascript jquery google-maps angle direction

我尝试使用此代码在Google地图上绘制数据 此代码通过jquery生成表格并在谷歌地图上绘制数据,并且还在加载小内容窗口上显示每个标记

现在我想将图像转换为方向

表中的数据是

No  Status Datetime                   Longitude Latitude    Direction
BF  5     2016-09-23 15:08:38.000    65.1197    34.95387      9
BR  5     2016-09-23 15:17:26.000    65.068758  34.8639578    30

我尝试使用此代码,但这不起作用

<script type="text/javascript">

    $(function () {

       var ID = '<%=Session["ID"]%>';
        var RegNo = '';
        var Status = '';
        var latit = '';
        var longi = '';
        var angle;

            var obj = {};
            obj.ID = ID;

            getdata(obj);
            return false;

    });

    function getdata(obj) {

        $.ajax({
            type: "POST",
            url: "home.aspx/info",
            contentType: "application/json;charset=utf-8",

            data: "{'id':'" + obj.ID + "'}",

            datatype: "json",


            success: function (result) {

                var d = JSON.parse(result.d).response;

                console.log(JSON.parse(result.d).response);

                console.log(JSON.stringify(result.d).response);

                $("#tabledata").empty();
                if (d.length > 0) {
                    $("#tabledata").append(
 "<thead><tr><th>No</th><th>DateTime</th><th>Status</thth>Longitude</th><th>Latitude</th<tr></thead>");

                    for (var i = 0; i < d.length - 1; i++) {
                        if (d[i] !== null) {
                            $("#tabledata").append("<tbody><tr><td>" +
                               d[i][0] + "</td> <td>" +
                               d[i][1] + "</td> <td>" +
                               d[i][2] + "</td> <td>" +
                               d[i][3] + "</td> <td>" +
                               d[i][4] + "</td></tr></tbody>");
                            Status = d[i][2];
                            debugger;
                            No = d[i][0];
                            latit = d[i][4];
                            longi = d[i][3];
                            angle = d[i][7];
                        }
                    }
                }
                else {
                    $("#tabledata").hide();
                }

                alert(d.length);
                var map;
                var image;
                debugger;
                var latlng = new google.maps.LatLng(54.0895898, 77.0998546);
                debugger;
                var myOptions = {
                    zoom: 8,
                    center: latlng,
                    mapTypeId: google.maps.MapTypeId.ROADMAP
                };

         map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

                for (i = 0; i < d.length - 1; i++) {
                    var data = d[i]
                    var myLatlng = new google.maps.LatLng(d[i][4], d[i][3]);
                    var marker = new google.maps.Marker({
                        position: myLatlng,
                        icon: "/images/car.png",
                        map: map,
                        title: 'Click me'

                    });

                     ({
                        content: 'window'
                    });
                    google.maps.event.addListener(marker, 'click', function () {
                        infowindow.open(map, marker, data);
                    });
                    infowindow.open(map, marker, data);
                }
                for (i = 0; i < d.length - 1; i++) {
                    debugger;
                    if (d[i][7] == 0) {
                        image = "images/google/0.png";
                    }
                    else if (d[i][7] > 0 & d[i][7] <= 15) {
                        img = "images/google/15.png";

                    }
                    else if (d[i][7] > 15 & d[i][7] <= 30) {
                        img = "images/google/30.png";

                    }
                    else if (d[i][7] > 30 & d[i][7] <= 45) {
                        img = "images/google/45.png";

                    }
                    else if (d[i][7] > 45 & d[i][7] <= 60) {
                        img = "images/google/60.png";

                    }
                           },
            error: function (error) {

                alert("error")
            }
        });
    }


</script>

0 个答案:

没有答案