我收到Marker未定义且$ scope未定义错误。 我想通过从表中传递deviceid来获取latlong值。 我无法通过Angulrjs调用wcf服务 对于DeviceId以下,我的LatLong值(13.0357695,77.59702219999997)在我的表中
这是我的剧本
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">
<html ng-app="RESTClientModule">
<head>
<title>Google Map</title>
<meta http-equiv="Content-Type" content="text/html; CHARSET=iso-8859-1">
<!-- Bootstrap Core CSS -->
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular.min.js"></script>
<%-- <script src="http://ajax.aspnetcdn.com/ajax/4.0/1/MicrosoftAjax.js"></script>
<script src="http://localhost:65235/GmapService.svc/getmapdata"></script>--%>
<script type="text/javascript">
var app;
var req;
var markers;
(function () {
app = angular.module("RESTClientModule", []);
})();
app.controller("RESTClientController", function ($scope, RESTClientService) {
$scope.lat = "0";
$scope.lng = "0";
$scope.markers = [];
instance = this;
instance.scope = $scope;
$scope.gMapModel = { deviceID: '911314150053752' }
req = $scope.gMapModel;
var promiseGet = RESTClientService.get();
promiseGet.then(function (pl) {
var latlng = pl.data.LatLong;
// alert(latlng);
latlng = latlng.split(',');
$scope.lat = latlng[0];
$scope.lng = latlng[1];
},
function (errorPl) {
$log.error('failure loading Employee', errorPl);
});
});
app.service("RESTClientService", function ($http) {
//alert(req);
this.get = function (result) {
return $http.post("http://localhost:65235/GmapService.svc/getmapdata", { "deviceID": "911314150055310" });
};
});
markers = [
{ "title": 'Bangalore',
"lat": $scope.lat,
"lng": $scope.lng,
"description": 'Test'
}
];
</script>
<script type="text/javascript">
window.onload = function () {
var mapOptions = {
center: new google.maps.LatLng(markers[0].lat, markers[0].lng),
zoom: 8,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var infoWindow = new google.maps.InfoWindow();
var map = new google.maps.Map(document.getElementById("dvMap"), mapOptions);
for (i = 0; i < markers.length; i++) {
var data = markers[i]
var myLatlng = new google.maps.LatLng(data.lat, data.lng);
var marker = new google.maps.Marker({
position: myLatlng,
map: map,
title: data.title
});
(function (marker, data) {
google.maps.event.addListener(marker, "click", function (e) {
infoWindow.setContent(data.description);
infoWindow.open(map, marker);
});
})(marker, data);
}
}
</script>
THIS IS MY HTML WHERE I WANT TO GET LATLONG??
</head>
<body ng-controller="RESTClientController">
<form id="form1" runat="server">
<div>
<div id="dvMap" style="width: 700px; height: 700px">
</div>
</div>
</form>
</body>
</html>
答案 0 :(得分:0)
您需要从控制器内部而不是google.maps.Map
调用window.onload
。
HTML
<div ng-app="mapsApp" ng-controller="MapCtrl">
<div id="map"></div>
</div>
JS
angular.module('mapsApp', []).controller('MapCtrl', function ($scope) {
var mapOptions = {
zoom: 4,
center: new google.maps.LatLng(40.0000, -98.0000),
mapTypeId: google.maps.MapTypeId.TERRAIN
}
$scope.map = new google.maps.Map(document.getElementById('map'),
mapOptions);
});