Question

77

AngularJS google maps directive

rated 0 times [ 81] [ 4] / answers: 1 / hits: 15148 / 11 Years ago, thu, september 19, 2013, 12:00:00

I'm trying to develop an app using angularjs and a directive that I've found for instantiate GMaps: http://nlaplante.github.io/angular-google-maps/#!/usage. I follow all the steps but I cant get to render the map! it returns no errors!

in the HTML

<html ng-app="Maptesting">

<div ng-view></div>

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

</script>

In the controller:

angular.module('Maptesting', ['google-maps'])



.controller('CtrlGMap', ['$scope', function($scope) {

        $scope.center = {

            latitude: 45,

            longitude: -73

        };



        $scope.markers = [];

        $scope.zoom = 8;



}])

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

karolinab

Add To Favorites

Follow

Total Points: 644

Total Questions: 98

Total Answers: 117

Location: Vanuatu

Member since Mon, Dec 7, 2020

4 Years ago

karolinab questions

1 API in NextJS that serves a JSON file, can I edit this file (after build, while running) and make the API serve the updated file?

Sun, Jun 6, 21, 00:00, 3 Years ago

1 How to format a text inside a variable in React using \n or < br/> or similar

Wed, Nov 25, 20, 00:00, 4 Years ago

1 eslint no-unused-vars varIgnorePattern not working

Thu, Jul 16, 20, 00:00, 4 Years ago

1 Flutter Web: Missing main.dart.js and JavaScript files when building with flutter build web, but working fine with flutter run

Sun, Jun 7, 20, 00:00, 4 Years ago

1 Changing CSS properties of an element while a file is being dragged

Tue, Mar 10, 20, 00:00, 4 Years ago

View All

answered 11 Years ago deannaalysonl · Accepted Answer

Different answer, but I felt google-maps-directive is harder for me to use. Thus, I have created a google maps angularjs directive called, ng-map for my own project. This does not require any Javascript coding for simple functionality.

it looks like this

<map zoom=11 center=[40.74, -74.18]>

  <marker position=[40.74, -74.18] />

  <shape name=circle radius=400 center=[40.74,-74.18] radius=4000 />

  <control name=overviewMap opened=true />

</map>