2013-05-17 14 views
12

के लिए जावास्क्रिप्ट के साथ Google मानचित्र ऑब्जेक्ट संरचना को नकली करें Google मानचित्र API ऑब्जेक्ट्स इस तरह उपयोग किए जाते हैं: google.maps."Constructor" ऐसा लगता है।यूनिट टेस्ट

मैं नकली कॉल नीचे सूचीबद्ध करना चाहते हैं ...

//var map = new google.maps.Map(value); 
//var fireStationBound = new google.maps.LatLng(val,val); 
//var bounds = new google.maps.LatLngBounds(boundary, boundary); 
//var markerFireStation = new google.maps.Marker(val); 
//var waterstationLayer = new google.maps.KmlLayer(val); 
//map.mapTypes.set(); 

... नीचे दिए गए कोड के साथ ...

$(document).ready(function() { 

    function google() { 

    /* todo: Setup for every constructor a test function returning the test data */ 

    function LatLng(value) { 

    } 

    function LatLngBounds(value,value) { 

    } 

    function Marker(value) { 

    } 

    function Map(value) { 

    } 

    function KmlLayer(value) { 

    } 

    var maps = { 
        maps: { 
          LatLng: LatLng, 
          LatLngBounds: LatLngBounds, 
          Marker: Marker, 
          Map: Map, 
          KmlLayer: KmlLayer 
         } 
       }; 
       return maps; 
    } 

    **// Works** 
    var google = new google();  
    var bound = new google.maps.LatLng(10); 
    var bounds = new google.maps.LatLngBounds(10,20); 
    var marker = new google.maps.Marker(10); 
    var layer = new google.maps.KmlLayer(10); 
    var map = new google.maps.Map(10); 
    **// Doesn't Work ** 
    map.mapTypes.set(); 
}); 

कैसे कर सकते हैं मैं नकली यह गूगल कोड ...

map.mapTypes.set(); 

... जो फोन करके दिया जाता है ...

var map = google.maps.Map(val); 

मेरी जावास्क्रिप्ट को map.mapTypes.set() टाइप करने के लिए क्या दिखाना चाहिए और आखिर में सेट फ़ंक्शन को कॉल किया गया है?

मैं केवल Google ऑब्जेक्ट्स को नकली बनाना चाहता हूं जो मैं यूनिट परीक्षणों के लिए अपने कोड में उपयोग करता हूं।

उत्तर

9

v3.19.18 के लिए हमारा Google मानचित्र स्टब यहां है। इसे मूल रूप से कॉफीस्क्रिप्ट में लिखा गया था, लेकिन मैंने इसे js2coffee के माध्यम से चलाया और यहां कच्चे जावास्क्रिप्ट कार्यान्वयन है। मैंने आपके लिए mapTypes.set() जोड़ा है।

window.stubGoogleAPIS = function() { 
return window.google = { 
    maps: { 
     Animation: {}, 
     BicyclingLayer: function() {}, 
     Circle: function() {}, 
     ControlPosition: {}, 
     Data: function() {}, 
     DirectionsRenderer: function() {}, 
     DirectionsService: function() {}, 
     DirectionsStatus: {}, 
     DirectionsTravelMode: {}, 
     DirectionsUnitSystem: {}, 
     DistanceMatrixElementStatus: {}, 
     DistanceMatrixService: function() {}, 
     DistanceMatrixStatus: {}, 
     ElevationService: function() {}, 
     ElevationStatus: {}, 
     FusionTablesLayer: function() {}, 
     Geocoder: function() {}, 
     GeocoderLocationType: {}, 
     GeocoderStatus: {}, 
     GroundOverlay: function() {}, 
     ImageMapType: function() {}, 
     InfoWindow: function() {}, 
     KmlLayer: function() {}, 
     KmlLayerStatus: {}, 
     LatLng: function() {}, 
     LatLngBounds: function() {}, 
     MVCArray: function() {}, 
     MVCObject: function() {}, 
     Map: function() { 
      return { 
       setTilt: function() { }, 
       mapTypes: { 
        set: function() { } 
       }, 
       overlayMapTypes: { 
        insertAt: function() { }, 
        removeAt: function() { } 
       } 
      }; 
     }, 
     MapTypeControlStyle: {}, 
     MapTypeId: { 
      HYBRID: '', 
      ROADMAP: '', 
      SATELLITE: '', 
      TERRAIN: '' 
     }, 
     MapTypeRegistry: function() {}, 
     Marker: function() {}, 
     MarkerImage: function() {}, 
     MaxZoomService: function() { 
      return { 
       getMaxZoomAtLatLng: function() { } 
      }; 
     }, 
     MaxZoomStatus: {}, 
     NavigationControlStyle: {}, 
     OverlayView: function() { }, 
     Point: function() {}, 
     Polygon: function() {}, 
     Polyline: function() {}, 
     Rectangle: function() {}, 
     SaveWidget: function() {}, 
     ScaleControlStyle: {}, 
     Size: function() {}, 
     StreetViewCoverageLayer: function() {}, 
     StreetViewPanorama: function() {}, 
     StreetViewService: function() {}, 
     StreetViewStatus: {}, 
     StrokePosition: {}, 
     StyledMapType: function() {}, 
     SymbolPath: {}, 
     TrafficLayer: function() {}, 
     TransitLayer: function() {}, 
     TransitMode: {}, 
     TransitRoutePreference: {}, 
     TravelMode: {}, 
     UnitSystem: {}, 
     ZoomControlStyle: {}, 
     __gjsload__: function() { }, 
     event: { 
      addListener: function() { } 
     }, 
     places: { 
      AutocompleteService: function() { 
       return { 
        getPlacePredictions: function() { } 
       }; 
      } 
     } 
    } 
}; 
+0

यह चाहिए ... लेकिन ऐसा नहीं है। मैं कॉफीस्क्रिप्ट को समझ नहीं पा रहा हूं और मेरे मैप टाइप्ससेट() के लिए एक लाल रेखा नहीं देख रहा हूं। कोई संकेत? – Elisabeth

+0

@ एलिसा मैंने इसे कच्चे जावास्क्रिप्ट में परिवर्तित कर दिया और 'mapTypes.set()' के लिए समर्थन जोड़ा। –

+0

धन्यवाद क्रिस मेरे Google मानचित्र यूनिट परीक्षण अब हरा है :) – Elisabeth

0
इस के लिए अपने Map() समारोह बदल

-

function Map(value) { 
    this.mapTypes = { 
     set:function(){ 
      return true; 
     }   
    }; 
} 

तो map.mapTypes.set();

जांच काम करना चाहिए इस link जो कैसे जावास्क्रिप्ट वर्ग को परिभाषित करने के लिए बताते हैं। बहुत उपयोगी।

5

यहां Google मानचित्र v3.23 के लिए एक स्टब है, जो लेखन के समय रिलीज़ संस्करण है। यह एपीआई अक्सर अद्यतन किया जाता है इसलिए मैंने संदर्भ API के प्रत्येक प्रासंगिक खंड के लिंक शामिल किए हैं: यदि कोई अपडेट आवश्यक है तो उन्हें ढूंढना आसान होना चाहिए:

window.stubGoogleAPIS = function() { 
return window.google = { 
maps: { 
    //https://developers.google.com/maps/documentation/javascript/reference#Animation 
    Animation: {}, 
    //https://developers.google.com/maps/documentation/javascript/reference#Attribution 
    Attribution: {}, 
    //https://developers.google.com/maps/documentation/javascript/reference#BicyclingLayer 
    BicyclingLayer: function() { }, 
    Circle: function() { }, 
    //https://developers.google.com/maps/documentation/javascript/reference#ControlPosition 
    ControlPosition: {}, 
    //https://developers.google.com/maps/documentation/javascript/reference#Data 
    Data: function() { }, 
    //https://developers.google.com/maps/documentation/javascript/reference#DirectionsRenderer 
    DirectionsRenderer: function() { }, 
    //https://developers.google.com/maps/documentation/javascript/reference#DirectionsService 
    DirectionsService: function() { }, 
    //https://developers.google.com/maps/documentation/javascript/reference#DirectionsStatus 
    DirectionsStatus: {}, 
    //https://developers.google.com/maps/documentation/javascript/reference#DistanceMatrixElementStatus 
    DistanceMatrixElementStatus: {}, 
    //https://developers.google.com/maps/documentation/javascript/reference#DistanceMatrixService 
    DistanceMatrixService: function() { }, 
    //https://developers.google.com/maps/documentation/javascript/reference#DistanceMatrixStatus 
    DistanceMatrixStatus: {}, 
    //https://developers.google.com/maps/documentation/javascript/reference#ElevationService 
    ElevationService: function() { }, 
    //https://developers.google.com/maps/documentation/javascript/reference#ElevationStatus 
    ElevationStatus: {}, 
    //https://developers.google.com/maps/documentation/javascript/reference#FusionTablesLayer 
    FusionTablesLayer: function() { }, 
    //https://developers.google.com/maps/documentation/javascript/reference#Geocoder 
    Geocoder: function() { }, 
    //https://developers.google.com/maps/documentation/javascript/reference#GeocoderLocationType 
    GeocoderLocationType: {}, 
    //https://developers.google.com/maps/documentation/javascript/reference#GeocoderStatus 
    GeocoderStatus: {}, 
    //https://developers.google.com/maps/documentation/javascript/reference#GroundOverlay 
    GroundOverlay: function() { }, 
    //https://developers.google.com/maps/documentation/javascript/reference#ImageMapType 
    ImageMapType: function() { }, 
    InfoWindow: function() { }, 
    //https://developers.google.com/maps/documentation/javascript/reference#KmlLayer 
    KmlLayer: function() { }, 
    //https://developers.google.com/maps/documentation/javascript/reference#KmlLayerStatus 
    KmlLayerStatus: {}, 
    //https://developers.google.com/maps/documentation/javascript/reference#LatLng 
    LatLng: function() { }, 
    //https://developers.google.com/maps/documentation/javascript/reference#LatLngBounds 
    LatLngBounds: function() { }, 
    //https://developers.google.com/maps/documentation/javascript/reference#MVCArray 
    MVCArray: function() { }, 
    //https://developers.google.com/maps/documentation/javascript/reference#MVCObject 
    MVCObject: function() { }, 
    //https://developers.google.com/maps/documentation/javascript/reference#Map 
    Map: function() { 
     return { 
      //methods 
      fitBounds: function() { }, 
      getBounds: function() { }, 
      getCenter: function() { }, 
      getDiv: function() { }, 
      getHeading: function() { }, 
      getMapTypeId: function() { }, 
      getProjection: function() { }, 
      getStreetView: function() { }, 
      getTilt: function() { }, 
      getZoom: function() { }, 
      panBy: function() { }, 
      panTo: function() { }, 
      panToBounds: function() { }, 
      setCenter: function() { }, 
      setHeading: function() { }, 
      setMapTypeId: function() { }, 
      setOptions: function() { }, 
      setStreetView: function() { }, 
      setTilt: function() { }, 
      setZoom: function() { }, 
      //properties 
      controls: {}, 
      data: { 
       //https://developers.google.com/maps/documentation/javascript/reference#Data 
       //methods 
       add: function() { }, 
       addGeoJson: function() { }, 
       contains: function() { }, 
       forEach: function() { }, 
       getControlPosition: function() { }, 
       getControls: function() { }, 
       getDrawingMode: function() { }, 
       getFeatureById: function() { }, 
       getMap: function() { }, 
       getStyle: function() { }, 
       loadGeoJson: function() { }, 
       overrideStyle: function() { }, 
       remove: function() { }, 
       revertStyle: function() { }, 
       setControlPosition: function() { }, 
       setControls: function() { }, 
       setDrawingMode: function() { }, 
       setMap: function() { }, 
       setStyle: function() { }, 
       toGeoJson: function() { }, 
       //properties 
       controlPosition: {}, 
       controls: [], 

      }, 
      mapTypes: { 
       //https://developers.google.com/maps/documentation/javascript/reference#MapTypeRegistry 
       //methods 
       set: function() { } 
      }, 
      overlayMapTypes: { 
       //https://developers.google.com/maps/documentation/javascript/reference#MVCArray 
       clear: function() { }, 
       getArray: function() { }, 
       getAt: function() { }, 
       getLength: function() { }, 
       insertAt: function() { }, 
       pop: function() { }, 
       push: function() { }, 
       removeAt: function() { }, 
       setAt: function() { } 
      } 
     }; 
    }, 
    MapTypeControlStyle: {}, 
    //https://developers.google.com/maps/documentation/javascript/reference#MapTypeId 
    MapTypeId: { 
     HYBRID: '', 
     ROADMAP: '', 
     SATELLITE: '', 
     TERRAIN: '' 
    }, 
    //https://developers.google.com/maps/documentation/javascript/reference#MapTypeRegistry 
    MapTypeRegistry: function() { }, 
    //https://developers.google.com/maps/documentation/javascript/reference#Marker 
    Marker: function() { 
     return { 
      setTitle: function (visible) { }, 
      setVisible: function() { }, 
      setZIndex: function() { } 
     } 
    }, 
    MarkerImage: function() { }, 
    //https://developers.google.com/maps/documentation/javascript/reference#MarkerOptions 
    MarkerOptions: { 
     visible: false 
    }, 
    //https://developers.google.com/maps/documentation/javascript/reference#MaxZoomService 
    MaxZoomService: function() { 
     return { 
      getMaxZoomAtLatLng: function() { } 
     }; 
    }, 
    //https://developers.google.com/maps/documentation/javascript/reference#MaxZoomStatus 
    MaxZoomStatus: {}, 
    NavigationControlStyle: {}, 
    OverlayView: function() { }, 
    //https://developers.google.com/maps/documentation/javascript/reference#Point 
    Point: function() { }, 
    //https://developers.google.com/maps/documentation/javascript/reference#Polygon 
    Polygon: function() { }, 
    //https://developers.google.com/maps/documentation/javascript/reference#Polyline 
    Polyline: function() { }, 
    //https://developers.google.com/maps/documentation/javascript/reference#Rectangle 
    Rectangle: function() { }, 
    //https://developers.google.com/maps/documentation/javascript/reference#SaveWidget 
    SaveWidget: function() { }, 
    //https://developers.google.com/maps/documentation/javascript/reference#ScaleControlStyle 
    ScaleControlStyle: {}, 
    //https://developers.google.com/maps/documentation/javascript/reference#Size 
    Size: function (width, height, wiidthUnit, heightUnit) { }, 
    //https://developers.google.com/maps/documentation/javascript/reference#StreetViewCoverageLayer 
    StreetViewCoverageLayer: function() { }, 
    //https://developers.google.com/maps/documentation/javascript/reference#StreetViewPanorama 
    StreetViewPanorama: function() { }, 
    //https://developers.google.com/maps/documentation/javascript/reference#StreetViewService 
    StreetViewService: function() { }, 
    //https://developers.google.com/maps/documentation/javascript/reference#StreetViewStatus 
    StreetViewStatus: {}, 
    //https://developers.google.com/maps/documentation/javascript/reference#StrokePosition 
    StrokePosition: {}, 
    //https://developers.google.com/maps/documentation/javascript/reference#StyledMapType 
    StyledMapType: function() { }, 
    //https://developers.google.com/maps/documentation/javascript/reference#SymbolPath 
    SymbolPath: {}, 
    //https://developers.google.com/maps/documentation/javascript/reference#TrafficLayer 
    TrafficLayer: function() { }, 
    //https://developers.google.com/maps/documentation/javascript/reference#TransitLayer 
    TransitLayer: function() { }, 
    //https://developers.google.com/maps/documentation/javascript/reference#TransitMode 
    TransitMode: {}, 
    //https://developers.google.com/maps/documentation/javascript/reference#TransitRoutePreference 
    TransitRoutePreference: {}, 
    //https://developers.google.com/maps/documentation/javascript/reference#TravelMode 
    TravelMode: {}, 
    //https://developers.google.com/maps/documentation/javascript/reference#UnitSystem 
    UnitSystem: {}, 
    //https://developers.google.com/maps/documentation/javascript/reference#ZoomControlStyle 
    ZoomControlStyle: {}, 
    __gjsload__: function() { }, 
    event: { 
     addListener: function() { } 
    }, 
    places: { 
     AutocompleteService: function() { 
      return { 
       getPlacePredictions: function() { } 
      }; 
     } 
    } 
} 
}; 
+0

सुंदर! एफवाईआई: मुझे इसे काम करने के लिए कुछ मामूली संपादन करने की ज़रूरत है, लेकिन शायद कुछ उपयोगों के लिए यह सीधे बॉक्स से बाहर काम करेगा। जैसे Google.maps.event.trigger जोड़ा गया, एक बिंदु वापस करने के लिए getCenter और LatLng अद्यतन करें, Maps.addListener जोड़ें। – python1981

संबंधित मुद्दे