4

angular-google-maps を機能させようとしています。指示に従ってすべてをセットアップしましたが、このエラーを回避できないようです:

angular-google-maps: 有効なセンター プロパティが見つかりませんでした

ページコントローラーにこれがあります：

angular.extend($scope, {
   center: {
    latitude: 0, // initial map center latitude
    longitude: 0, // initial map center longitude
   },
   markers: [], // an array of markers,
   zoom: 8, // the zoom level
});

そして、これは私のhtmlにあります

<google-map center="center" zoom="zoom" markers="markers" refresh="!isMapElementHidden" style="height: 400px"></google-map>

いくつかのポイント: - angular-google-maps ディレクティブ コードがコントローラー コードの前に呼び出されているように見えるため、 $scope.center 変数はまだ作成されていません

  • センターをハードコーディングすると機能します

  • これを試してみましたが、コントローラーに設定された新しい対処値にマップが更新されないため、うまくいきませんでした。

    center="center ? center : {緯度: 36.990282103105066、経度: -122.06149578094482}"

  • また、Angular Leaflet マップを実装しようとしましたが、まったく同じ問題が発生しました

ありがとう！

4

2 に答える 2

5

ワーキングデモ

center プロパティを渡していません。さらに、angular-google-maps のmasterブランチ ディレクティブではなく、 r1-devブランチ ディレクティブを使用することをお勧めします。このようなパラメータを渡します。

 angular.extend($scope, {
        centerProperty: {
            lat: 45,
            lng: -73
        },
        zoomProperty: 8,
        markersProperty: [ {
                latitude: 45,
                longitude: -74
            }],
        clickedLatitudeProperty: null,  
        clickedLongitudeProperty: null,
    });

または使用することもできます

position: {
  coords: {
    latitude: 36.990282103105066,
    longitude: -122.06149578094482
  }
},
于 2013-10-15T12:06:15.943 に答える