Add generics support to MVCArray. (#15432)

Tests cleaning.
This commit is contained in:
Olivier
2017-04-25 07:52:56 -07:00
committed by Andy
parent 422acb931f
commit 31185fe81a
2 changed files with 169 additions and 131 deletions
+122 -97
View File
@@ -1,7 +1,20 @@
// Test file for Google Maps JavaScript API Definition file
/***** Create map *****/
let map = new google.maps.Map(
document.getElementById('map'), {
backgroundColor: "#fff",
center: { lat: -25.363, lng: 131.044 },
clickableIcons: true,
draggable: true,
fullscreenControl: true,
fullscreenControlOptions: {
position: google.maps.ControlPosition.RIGHT_TOP
},
scrollwheel: true,
zoom: 4
});
var map = new google.maps.Map(document.querySelector("☺"));
/***** Data *****/
@@ -28,7 +41,7 @@ data.forEach((feature: google.maps.Data.Feature) => {
console.log(feature.getId());
});
var map: google.maps.Map = data.getMap();
map = data.getMap();
data.setMap(map);
var style = data.getStyle();
@@ -39,7 +52,7 @@ data.setStyle({
cursor: "pointer",
fillColor: "#79B55B",
fillOpacity: 1,
icon: {},
icon: <google.maps.Icon>{ url: "//maps.google.com/mapfiles/ms/icons/blue.png" },
shape: { coords: [1, 2, 3], type: "circle" },
strokeColor: "#79B55B",
strokeOpacity: 1,
@@ -50,11 +63,20 @@ data.setStyle({
});
data.overrideStyle(feature, { visible: true });
data.revertStyle(feature);
data.addGeoJson({});
data.addGeoJson({}, { idPropertyName: "Test feature" });
data.addGeoJson({ "type": "Feature", "geometry": { "type": "Point", "coordinates": [59.327090, 18.103701] } });
data.addGeoJson({
"type": "FeatureCollection",
"features": [{
"type": "Feature",
"properties": { "dymmy": "7", },
"geometry": {
"type": "Polygon",
"coordinates": [[[123.61, -22.14], [122.38, -21.73], [121.06, -21.69], [119.66, -22.22], [119.00, -23.40], [123.61, -22.14]]]
}
}],
}, { idPropertyName: "Test feature" });
data.loadGeoJson("http://magicGeoJsonSource.com");
@@ -141,115 +163,67 @@ var mapTypeStyle: google.maps.MapTypeStyle ={
stylers: [],
};
/***** MARKERS *****/
// https://developers.google.com/maps/documentation/javascript/markers
function initMap1() {
var myLatLng = {lat: -25.363, lng: 131.044};
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 4,
center: myLatLng
});
var marker = new google.maps.Marker({
position: myLatLng,
map: map,
title: 'Hello World!'
});
}
var myLatlng = new google.maps.LatLng(-25.363882,131.044922);
var mapOptions = {
zoom: 4,
center: myLatlng
}
var map = new google.maps.Map(document.getElementById("map"), mapOptions);
var marker = new google.maps.Marker({
position: myLatlng,
title:"Hello World!"
map.setCenter({ lat: 59.332457, lng: 18.064790 });
// Marker with map and LatLngLiteral position
let markerSimple = new google.maps.Marker({
label: "A",
position: { lat: 59.33555, lng: 18.029851 },
map: map,
title: 'Hello World!'
});
// To add the marker to the map, call setMap();
marker.setMap(map);
marker.setMap(null);
// Marker without map and LatLng position
let markerRemovable = new google.maps.Marker({
position: new google.maps.LatLng(59.337647,18.089950),
title:"Hello World!"
});
markerRemovable.setMap(map); // Add marker
markerRemovable.setMap(null); // Remove marker, should accept null
// Marker with animation
// The following example creates a marker in Stockholm, Sweden using a DROP
// animation. Clicking on the marker will toggle the animation between a BOUNCE
// animation and no animation.
var marker: google.maps.Marker;
function initMap2() {
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 13,
center: {lat: 59.325, lng: 18.070}
});
marker = new google.maps.Marker({
map: map,
draggable: true,
animation: google.maps.Animation.DROP,
position: {lat: 59.327, lng: 18.067}
});
marker.addListener('click', toggleBounce);
}
let markerBounce = new google.maps.Marker({
map: map,
draggable: true,
animation: google.maps.Animation.DROP,
position: { lat: 59.327, lng: 18.067 }
});
markerBounce.addListener("click", toggleBounce);
function toggleBounce() {
if (marker.getAnimation() !== null) {
marker.setAnimation(null);
if (markerBounce.getAnimation() !== null) {
markerBounce.setAnimation(null);
} else {
marker.setAnimation(google.maps.Animation.BOUNCE);
markerBounce.setAnimation(google.maps.Animation.BOUNCE);
}
}
// In the following example, markers appear when the user clicks on the map.
// Each marker is labeled with a single alphabetical character.
var labels = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
var labelIndex = 0;
function initialize() {
var bangalore = { lat: 12.97, lng: 77.59 };
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 12,
center: bangalore
});
// This event listener calls addMarker() when the map is clicked.
google.maps.event.addListener(map, 'click', function(event: any) {
addMarker(event.latLng, map);
});
// Add a marker at the center of the map.
addMarker(bangalore, map);
}
// Adds a marker to the map.
function addMarker(location: google.maps.LatLngLiteral, map: google.maps.Map) {
// Add the marker at the clicked location, and add the next-available label
// from the array of alphabetical characters.
var marker = new google.maps.Marker({
position: location,
label: labels[labelIndex++ % labels.length],
map: map
});
}
google.maps.event.addDomListener(window, 'load', initialize);
/***** OverlayView *****/
// https://developers.google.com/maps/documentation/javascript/customoverlays
var div = document.createElement('div');
var overlay = new google.maps.OverlayView();
var panes = overlay.getPanes();
panes.floatPane.appendChild(div);
panes.floatShadow.appendChild(div);
panes.mapPane.appendChild(div);
panes.markerLayer.appendChild(div);
panes.overlayImage.appendChild(div);
panes.overlayLayer.appendChild(div);
panes.overlayMouseTarget.appendChild(div);
panes.overlayShadow.appendChild(div);
class Overlay extends google.maps.OverlayView {
public draw(): void {
var panes = this.getPanes();
panes.floatPane.appendChild(div);
panes.floatShadow.appendChild(div);
panes.mapPane.appendChild(div);
panes.markerLayer.appendChild(div);
panes.overlayImage.appendChild(div);
panes.overlayLayer.appendChild(div);
panes.overlayMouseTarget.appendChild(div);
panes.overlayShadow.appendChild(div);
};
}
var overlay = new Overlay();
overlay.setMap(map);
/***** Rectangles *****/
// https://developers.google.com/maps/documentation/javascript/examples/rectangle-simple
@@ -291,6 +265,7 @@ var circle2 = new google.maps.Circle({
strokeWeight: 1
});
/***** StreetViewPanorama *****/
var panoramaOptions: google.maps.StreetViewPanoramaOptions = {
zoom: 0,
@@ -304,3 +279,53 @@ var panoramaOptions: google.maps.StreetViewPanoramaOptions = {
motionTrackingControl: true
};
var panorama = new google.maps.StreetViewPanorama(document.createElement("div"), panoramaOptions);
/***** MVCArray *****/
// MVCArray should be generic
let mvcArrayStr = new google.maps.MVCArray<string>(["a", "b", "c"]);
mvcArrayStr.forEach((elem: string, i: number): void => { elem.toUpperCase(); });
mvcArrayStr.getArray()[0].toUpperCase();
mvcArrayStr.getAt(0).toUpperCase();
mvcArrayStr.insertAt(2, "x");
mvcArrayStr.pop().toUpperCase();
mvcArrayStr.push("y");
mvcArrayStr.removeAt(0).toUpperCase();
mvcArrayStr.setAt(0, "z");
/***** HeatMaps *****/
let heatmap = new google.maps.visualization.HeatmapLayer({
data: [new google.maps.LatLng(37.782551, -122.445368), new google.maps.LatLng(37.782745, -122.444586), new google.maps.LatLng(37.782842, -122.443688)],
map: map
});
// setData Should Accept MVCArray<LatLng>
heatmap.setData(new google.maps.MVCArray<google.maps.LatLng>(
[new google.maps.LatLng(37.782551, -122.445368), new google.maps.LatLng(37.782745, -122.444586), new google.maps.LatLng(37.782842, -122.443688)]
));
// getData Should return MVCArray<LatLng>
let heatmapDataMvcLL = heatmap.getData<google.maps.LatLng>();
console.log(heatmapDataMvcLL.getAt(0).lat()); // should not throw
// setData Should Accept MVCArray<WeightedLocation>
heatmap.setData(new google.maps.MVCArray<google.maps.visualization.WeightedLocation>([
{ weight: 1, location: new google.maps.LatLng(37.782551, -122.445368) },
{ weight: 2, location: new google.maps.LatLng(37.782745, -122.444586) },
{ weight: 3, location: new google.maps.LatLng(37.782842, -122.443688) }
]));
// getData Should return MVCArray<LatLng>
let heatmapDataWL = heatmap.getData<google.maps.visualization.WeightedLocation>();
console.log(heatmapDataWL.getAt(0).weight); // should not throw
// setData Should Accept LatLng[]
heatmap.setData([new google.maps.LatLng(37.782551, -122.445368), new google.maps.LatLng(37.782745, -122.444586), new google.maps.LatLng(37.782842, -122.443688)]);
// setData Should Accept WeightedLocation[]
heatmap.setData([
{ weight: 1, location: new google.maps.LatLng(37.782551, -122.445368) },
{ weight: 2, location: new google.maps.LatLng(37.782745, -122.444586) }
]);
+47 -34
View File
@@ -51,10 +51,10 @@ declare namespace google.maps {
setStreetView(panorama: StreetViewPanorama): void;
setTilt(tilt: number): void;
setZoom(zoom: number): void;
controls: MVCArray[]; //Array<MVCArray<Node>>
controls: MVCArray<Node>[];
data: Data;
mapTypes: MapTypeRegistry;
overlayMapTypes: MVCArray; // MVCArray<MapType>
overlayMapTypes: MVCArray<MapType>;
}
export interface MapOptions {
@@ -831,13 +831,13 @@ declare namespace google.maps {
getDraggable(): boolean;
getEditable(): boolean;
getMap(): Map;
getPath(): MVCArray; // MVCArray<LatLng>
getPath(): MVCArray<LatLng>;
getVisible(): boolean;
setDraggable(draggable: boolean): void;
setEditable(editable: boolean): void;
setMap(map: Map | null): void;
setOptions(options: PolylineOptions): void;
setPath(path: MVCArray|LatLng[]|LatLngLiteral[]): void; // MVCArray<LatLng>|Array<LatLng|LatLngLiteral>
setPath(path: MVCArray<LatLng>|LatLng[]|LatLngLiteral[]): void;
setVisible(visible: boolean): void;
}
@@ -871,7 +871,7 @@ declare namespace google.maps {
* Note that if you pass a simple array, it will be converted to an MVCArray Inserting or removing LatLngs
* in the MVCArray will automatically update the polyline on the map.
*/
path?: MVCArray|LatLng[]|LatLngLiteral[]; // MVCArray<LatLng>|Array<LatLng|LatLngLiteral>
path?: MVCArray<LatLng>|LatLng[]|LatLngLiteral[];
/** The stroke color. All CSS3 colors are supported except for extended named colors. */
strokeColor?: string;
/** The stroke opacity between 0.0 and 1.0. */
@@ -896,20 +896,17 @@ declare namespace google.maps {
getDraggable(): boolean;
getEditable(): boolean;
getMap(): Map;
getPath(): MVCArray; // MVCArray<LatLng>
getPaths(): MVCArray; // MVCArray<MVCArray<LatLng>>
/** Retrieves the first path. */
getPath(): MVCArray<LatLng>;
/** Retrieves the paths for this polygon. */
getPaths(): MVCArray<MVCArray<LatLng>>;
getVisible(): boolean;
setDraggable(draggable: boolean): void;
setEditable(editable: boolean): void;
setMap(map: Map | null): void;
setOptions(options: PolygonOptions): void;
setPath(path: MVCArray|LatLng[]|LatLngLiteral[]): void;
setPaths(paths: MVCArray): void;
setPaths(paths: MVCArray[]): void;
setPaths(path: LatLng[]): void;
setPaths(path: LatLng[][]): void;
setPaths(path: LatLngLiteral[]): void;
setPaths(path: LatLngLiteral[][]): void;
setPath(path: MVCArray<LatLng>|LatLng[]|LatLngLiteral[]): void;
setPaths(paths: MVCArray<MVCArray<LatLng>> | MVCArray<LatLng> | LatLng[][] | LatLngLiteral[][] | LatLng[] | LatLngLiteral[]): void;
setVisible(visible: boolean): void;
}
@@ -950,7 +947,7 @@ declare namespace google.maps {
* converted into MVCArrays. Inserting or removing LatLngs from the MVCArray
* will automatically update the polygon on the map.
*/
paths?: any[]; // MVCArray<MVCArray<LatLng>>|MVCArray<LatLng>|Array<Array<LatLng|LatLngLiteral>>|Array<LatLng|LatLngLiteral>
paths?: MVCArray<MVCArray<LatLng>> | MVCArray<LatLng> | LatLng[][] | LatLngLiteral[][] | LatLng[] | LatLngLiteral[];
/**
* The stroke color.
* All CSS3 colors are supported except for extended named colors.
@@ -1930,7 +1927,7 @@ declare namespace google.maps {
/***** Street View *****/
export class StreetViewPanorama {
constructor(container: Element, opts?: StreetViewPanoramaOptions);
controls: MVCArray[]; // Array<MVCArray<Node>>
controls: MVCArray<Node>[];
getLinks(): StreetViewLink[];
getLocation(): StreetViewLocation;
getMotionTracking(): boolean;
@@ -2282,25 +2279,43 @@ declare namespace google.maps {
unbindAll(): void;
}
export class MVCArray extends MVCObject {
constructor(array?: any[]);
/** This class extends MVCObject. */
export class MVCArray<T> extends MVCObject {
/** A mutable MVC Array. */
constructor(array?: T[]);
/** Removes all elements from the array. */
clear(): void;
forEach(callback: (elem: any, i: number) => void): void;
getArray(): any[];
getAt(i: number): any;
/**
* Iterate over each element, calling the provided callback.
* The callback is called for each element like: callback(element, index).
*/
forEach(callback: (elem: T, i: number) => void): void;
/**
* Returns a reference to the underlying Array.
* Warning: if the Array is mutated, no events will be fired by this object.
*/
getArray(): T[];
/** Returns the element at the specified index. */
getAt(i: number): T;
/** Returns the number of elements in this array. */
getLength(): number;
insertAt(i: number, elem: any): void;
pop(): any;
push(elem: any): number;
removeAt(i: number): any;
setAt(i: number, elem: any): void;
/** Inserts an element at the specified index. */
insertAt(i: number, elem: T): void;
/** Removes the last element of the array and returns that element. */
pop(): T;
/** Adds one element to the end of the array and returns the new length of the array. */
push(elem: T): number;
/** Removes an element from the specified index. */
removeAt(i: number): T;
/** Sets an element at the specified index. */
setAt(i: number, elem: T): void;
}
/***** Geometry Library *****/
export module geometry {
export class encoding {
static decodePath(encodedPath: string): LatLng[];
static encodePath(path: any[]): string; // LatLng[]|MVCArray<LatLng>
static encodePath(path: LatLng[] | MVCArray<LatLng>): string;
}
/**
@@ -2314,7 +2329,7 @@ declare namespace google.maps {
* The radius defaults to the Earth's radius in meters,
* in which case the area is in square meters.
*/
static computeArea(path: any[], radius?: number): number; // LatLng[]|MVCArray<LatLng>
static computeArea(path: LatLng[] | MVCArray<LatLng>, radius?: number): number;
/**
* Returns the distance, in meters, between two LatLngs.
* You can optionally specify a custom radius.
@@ -2329,7 +2344,7 @@ declare namespace google.maps {
/**
* Returns the length of the given path.
*/
static computeLength(path: any[], radius?: number): number; // LatLng[]|MVCArray<LatLng>
static computeLength(path: LatLng[] | MVCArray<LatLng>, radius?: number): number;
/**
* Returns the LatLng resulting from moving a distance from an origin in the
* specified heading (expressed in degrees clockwise from north).
@@ -2347,7 +2362,7 @@ declare namespace google.maps {
* The radius defaults to the Earth's radius in meters, in which case the area is in
* square meters.
*/
static computeSignedArea(loop: any[], radius?: number): number; // LatLng[]|MVCArray<LatLng>
static computeSignedArea(loop: LatLng[] | MVCArray<LatLng>, radius?: number): number;
/**
* Returns the LatLng which lies the given fraction of the way between the origin
* LatLng and the destination LatLng.
@@ -2793,11 +2808,9 @@ declare namespace google.maps {
export class HeatmapLayer extends MVCObject {
constructor(opts?: HeatmapLayerOptions);
getData(): MVCArray;
getData<T extends LatLng | WeightedLocation>(): MVCArray<T>;
getMap(): Map;
setData(data: MVCArray): void;
setData(data: LatLng[]): void;
setData(data: WeightedLocation[]): void;
setData(data: MVCArray<LatLng|WeightedLocation> | LatLng[] | WeightedLocation[]): void;
setMap(map: Map | null): void;
}