smj_7038
/
MESProductionWeb


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162
							<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<title>轨迹回放</title>
<link rel="stylesheet" href="http://cache.amap.com/lbs/static/main.css" />
<script src="http://webapi.amap.com/maps?v=1.3&key=fa36ec6323075f37020083ceffe8eb24"></script>

<script src="/source/js/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="/source/My97DatePicker/WdatePicker.js"></script>
<link rel="stylesheet" href="/source/css/dxt.css" />
<style>
    #mapContainer {
        height: 88%;
        width: 98%;
        margin: 5px auto;
        position: relative;
        border: 2px solid rgb(255,255,255)
    }
</style>
<body class="bg">
    <div class="main_layout">
        <!-- 标题 -->
        <div class="title">
            <form>
                <label>任务时间：</label> <input id="d4311" class="Wdate" type="text" onFocus="WdatePicker({maxDate:'#F{$dp.$D(\'d4312\')||\'2020-10-01\'}',isShowClear:false,readOnly:true})" />
                <input type="button" value="搜索">
            </form>
        </div>
        <!-- 地图 -->
        <div id="mapContainer"></div>
    </div>
    <script>
        var map;
        $(function () {
            init();
            getAjax();
            //绑定事件
            $(".title input[type='button']").click(submitSerch);
        });
        var submitSerch = function () {
            var reg = /^([0-9]|[\-])*$/;
            var start = $("#d4311").val().trim();
            var end = $("#d4312").val().trim();
            var name = $(".name").val().trim();
            var ehr = $(".ehr").val().trim();

            if (start || end || name || ehr) {
                getAjax(start, end, name, ehr);
            }
        };
        function getAjax(start, end, name, ehr) {
            $.ajax({
                url: "/taskTrajectory/selectTaskTrajectoryInfo",
                type: "get",
                dataType: "json",
                data: {
                    "account": "15614141414",
                    "taskTime": "2017-09-21"
                },
                success: function (data) {
                    //初始化请求
                    if (data != null && data.status == 0) {
                        var result = data.result;
                        if (result.length == 0) {
                            alert("抱歉，您当前没有访调轨迹！");
                        }
                        //清楚显示
                        map.clearMap();
                        line(result);
                        addMarker(result);
                    } else {
                        alert("您没有访调记录");
                    }
                },
            });

        }


        function init() {
            //创建地图对象
            map = new AMap.Map("mapContainer", {
                resizeEnable: true,
                zoom: 12,
                mapStyle: "light"
            });

            //加载缩放条事件
            map.plugin(["AMap.ToolBar"], function () {
                toolBar = new AMap.ToolBar();
                map.addControl(toolBar);

            });

        }
        function line(data) {
            var lineArr = new Array();

            $.each(data, function (index, value) {

                var array = (value.position).split(",");
                lineArr.push(new AMap.LngLat(parseFloat(array[1]), parseFloat(array[0])));
            });
            // 绘制轨迹
            var polyline = new AMap.Polyline({
                map: map,
                path: lineArr,
                strokeColor: "rgb(104,180,255)",  //线颜色
                strokeOpacity: 1,     //线透明度
                strokeWeight: 2,      //线宽
                strokeStyle: "solid", //线样式
                geodesic: true
            });
            map.setFitView();

        }

        function addMarker(data) {

            $.each(data, function (index, value) {
                var array = (value.position).split(",");
                var p0 = parseFloat(array[1]);
                var p1 = parseFloat(array[0]);
                var action = "AMAP_ANIMATION_DROP";
                var point = new AMap.LngLat(p0, p1);
                var marker = new AMap.Marker({
                    id: index,
                    map: map,
                    position: point,
                    icon: "/source/img/flag.png",
                    autoRotation: true,
                    animation: action

                });
                createInfoWindow(value, marker);

            });
        }
        function createInfoWindow(value, marker) {
            var info = [];
            /* info.push("<a href='/emplpyer/task/get/"+value.id+"' target='main'  ><div style='font-weight:bold;color:#000;font-family:'微软雅黑';text-align:center;font-size:'><div><img src='http://wiscc6911.qnoddns.org.cn:8400/file/web/download/10143.jpg' width='80' height='80'> "); */
            info.push("任务: " + value.taskName + "");
            info.push("时间 : " + value.taskTime + "");
            info.push("地址 :" + value.taskAddress + "</div></div></a>");

            var iw = new AMap.InfoWindow({
                content: info.join("<br>"),
                offset: new AMap.Pixel(0, -25),
                isCustom: false,
                autoMove: true
            });

            AMap.event.addListener(marker, "mouseover", function (e) {
                iw.open(map, marker.getPosition());
            });
        }


    </script>
</body>

</html>