如何将表中的行与ammaps相关联

时间:2016-08-04 17:40:12

标签: angularjs ammap

我正在研究AngularJs应用程序,我正在使用ammaps。我有一个表,其中列出了每行有四列的所有员工:{Id,name,location and description}。我正在使用该位置在地图上显示每位员工的位置。现在,当我单击表格中的行时,应突出显示地图上的点。任何人都可以告诉我如何实现这一目标。

<div class="customTable">
    <table class="table">
        <thead class="active">
            <tr>
                <th>Employee ID</th>
                <th>Name</th>
                <th>Location</th>
                <th>Description</th>
            </tr>
        </thead>
        <tbody ng-repeat="emp in enployees| filter:filterCriteria">
            <tr>
                <td>{{emp.empId}}</td>
                <td>{{emp.empname}}</td>
                <td>{{emp.location}}</td>
                <td>{{emp.description}}</td>    
            </tr>
        </tbody>
    </table>
</div>

控制器中的代码:

$http.get("http://localhost:9081/employee/details/map")
            .then(response => {
                /*
                 Create two circles for each map point.
                 The top image has a thick white outline.
                 The bottom image is larger with no outline.
                 The effect is like a "bull's eye", so there's a circle with a colored ring, white ring, and colored center.
                 This is easier to stop on the map than a solid circle.
                 */
                const images = response.data.map(point => {
                    return {
                        latitude: point.latitude,
                        longitude: point.longitude,
                        title: point.name,
                        idBase: point.id,
                        id: `${point.id}.1`,
                        selectable: true
                    }
                });


                map.addListener("clickMapObject", function (event) {
                    console.log(event.mapObject.title);
                    alert(event.mapObject.title);
                });

                map.dataProvider.images = images;
                map.validateData();
            });

0 个答案:

没有答案