BingMap - null 오류의 프로토 타입 가져 오기

Question

Google을 검색하고 stackoverflow을 검색했지만이 문제에 solution을 찾을 수 없습니다. 내 view에 map을로드하고 있습니다. 다음은

<img 
     ng-src='https://dev.virtualearth.net/REST/v1/Imagery/Map/Road/ 
       {{Latitude.__text}},{{Longitude.__text}}/12?mapSize=77,120&amp; 
          key={{Key}}'></img> 

은 index.html을 내가 maps를 호출하는 것을 시도하고 아래

<script type='text/javascript' src='https://www.bing.com/mapspreview/sdkrelease/mapcontrol?callback=loadMapScenario' async defer></script> 
<script type='text/javascript' src='app/services/bing.js?' async defer></script> 

내 controller 코드가, 얼마나 그로드됩니다. 당신이 기능 오지도를로드하는 다른 콜백 함수를 사용하는지도 스크립트 URL에서

TypeError: Cannot read property 'prototype' of null 
    at k (bing.js:11) 
    at h (bing.js:11) 
    at e (bing.js:11) 
    at t.l [as instance] (bing.js:11) 
    at h (bing.js:11) 
    at e (bing.js:11) 
    at t.l [as instance] (bing.js:11) 
    at new Microsoft.Maps.Map (bing.js:13) 
    at HTMLDocument.<anonymous> (file-location.js:121) 
    at j (jquery-1.11.0.min.js:2) 

Answer 1

:

function GetMap() { 
    if (typeof Microsoft !== undefined && typeof Microsoft.Maps !== undefined && 
     Microsoft.Maps.Map !== null) { 
     //Map API available add your map load code. 
     angular.element(document).ready(function() { 
      map = new Microsoft.Maps.Map(document.getElementById('myMapL'), { 
       credentials: Key, 
       mapTypeId: "r", 
       zoom: 4 
      }); 
     }); 
    } else { 
     setTimeout(GetMap(), 100); 
    } 
} 

나는 아래의 오류를 얻고있다. (loadScenario 대 GetMap). 또한 문서화 된지도 스크립트 URL이 아닌 리디렉션 URL을 사용하고있는 것으로 보입니다 (향후에 문제가 발생할 수 있음). 지도 스크립트 URL을 다음으로 변경하십시오.

<script type='text/javascript' src='http://www.bing.com/api/maps/mapcontrol?branch=experimental&callback=GetMap' async defer></script> 

앱에 bing.js가 무엇인지 확실하지 않습니다. 이것이로드 코드를 매핑 한 곳이라고 가정합니다. 맵 스크립트 전에로드해야합니다. 그렇지 않으면 코드 스크립트가로드되기 전에 맵 스크립트가로드되어 GetMap 함수가 페이지에로드되기 전에 맵을로드하려고 시도 할 수 있습니다.

다른 방법으로는 유용이 코드 샘플을 찾을 수 있습니다 : https://github.com/Microsoft/BingMapsV8CodeSamples/blob/master/Samples/Experimental/Map_WithAngular1.html

Answer 2

을 경우에, 당신은 단지보기에 static map을 생성하는 것 빙지도 API (http://www.bing.com/api/maps/mapcontrol) 및 초기화지도 제어의 로딩 (GetMap function)을 생략 할 수 있습니다.

오류지고 이유 :

TypeError: Cannot read property 'prototype' of null

때문에보기에지도 컨테이너 선언을 누락 가능성이 높습니다

<div id="myMapL"></div> 

예

var app = angular.module("myApp", []); 
 
app.controller("bingMapsCtrl", function ($scope) { 
 
    
 
    $scope.Key = "As1l7HRtrpkXzjXozp3M2ufUTDvj16b2MHlpscQmHJEtxYFZWqwyccSx7I5XXEW_"; 
 

 
});

<script type='text/javascript' src="http://ajax.googleapis.com/ajax/libs/angularjs/1.6.0/angular.js"></script> 
 
<div ng-app="myApp" ng-controller="bingMapsCtrl" ng-cloak> 
 
     <!--div id="myMapL"></div--> 
 
     <img 
 
     ng-src='http://dev.virtualearth.net/REST/V1/Imagery/Map/Road/Bellevue%20Washington?mapLayer=TrafficFlow&amp;key={{Key}}'></img> 
 
    </div>

Answer 3

BING MAP API 8에는 참조 순서와 관련된 일부 문제가있는 것으로 보입니다. Rick에게보고하려고합니다.

는

작동하지 않는다 :

mapcontrol:11 Uncaught TypeError: Cannot read property 'prototype' of null 
    at k (mapcontrol:11) 
    at n.h [as create] (mapcontrol:11) 
    at e (mapcontrol:11) 
    at t.l [as instance] (mapcontrol:11) 
    at n.h [as create] (mapcontrol:11) 
    at e (mapcontrol:11) 
    at t.l [as instance] (mapcontrol:11) 
    at new Microsoft.Maps.Map (mapcontrol:13) 
    at ChildScope.$scope.init (maptest.html:92) 
    at HTMLDocument.<anonymous> (maptest.html:99) 

합니까 일 :

<script src="https://code.jquery.com/jquery-2.2.4.js"></script> 
<script type='text/javascript' src="http://ajax.googleapis.com/ajax/libs/angularjs/1.6.0/angular.js"></script> 

이가 실패

<script type='text/javascript' src="http://ajax.googleapis.com/ajax/libs/angularjs/1.6.0/angular.js"></script> 
<script src="https://code.jquery.com/jquery-2.2.4.js"></script> 

하지만 ... 시대를 중단하지입니다 Angular가로드되는 방법. 다시 드로잉 보드에.