2016-04-05 8 views
0

こんにちは、私はangularJsで新しいです。私はgoogleMapを表示しようとしています。私は例外$要素不明のプロバイダを得た。私がテストしているコードは、検索中に見つけたコードです。実際にはそれほど多くはありません。

htmlページ:

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="ISO-8859-1"> 
<title> </title> 
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script> 
<script src="../angular/angular.js"></script> 
<script src="../angular/angular-route.js"></script> 


<script src="../src/controllers/app.js"></script> 

</head> 
    <body> 
    <figure data-ng-controller="MapController"> 
     <gmap></gmap> 
    </figure> 
    </body> 

私のスクリプトは次のとおりです。シンプルなグーグルマップを作るためにそのノー最良の方法ザッツ

myAppControllers.controller('MapController',function($scope,$element){ 

    console.log("tessstttt "); 
    $scope.showMap(); 
    $scope.showMap = function() 
    { 
    const mapEl = $element.find('gmap')[0]; 
     const mapOptions = { 
     zoom: 14, 
     center: {lat: 34.075328, lng: -118.330432}  
     }; 
     const gmap = new google.maps.Map(mapEl, mapOptions); 
     $scope.gmap = gmap; 
    }; 
}); 
+1

はあなたを行います実際にこのコードを使用することはできませんか、グーグルマップで良い方法で解決策を教えてもらえますか? –

答えて

0

。ここではこれをチェックするfuncionallyフィドルとの簡単な例を超えるそのA:

HTML:

<div ng-controller="ControllerFirst"> 
<div id="maps"></div> 
hello 
</div> 

JS:

angular.module('myApp', []) 
.controller('ControllerFirst',function($scope){ 
     var mapOptions = { 
      center: new google.maps.LatLng(50, 2), 
      zoom: 4, 
      mapTypeId: google.maps.MapTypeId.ROADMAP, 
      scrollwheel: false 
     }; 
      var map = new google.maps.Map(document.getElementById("maps"),mapOptions); 
}); 

あなたは私のバイオリンでこの作業を確認することができます。http://jsfiddle.net/javierif/p16cyuha/

+0

私はそれを試してくれてありがとう、それは私のデータベースからいくつかのマーカーを追加して私とうまくいっている。今私がしようとしているのは、私の場所に最も近い場所を探すことです。私は失われたので、いくつかの例やチュートリアルを持っていますか? – yeddez

関連する問題