hand-detection/assets/scripts/map.demo.js

381 lines
10 KiB
JavaScript

/**
* Theme: Ninja Admin Template
* Author: NinjaTeam
* Module/App: Google Maps
*/
(function($) {
"use strict";
if ($("#map-default").length){
var mapCanvas = document.getElementById("map-default");
var mapOptions = {
center: new google.maps.LatLng(51.508742,-0.120850),
zoom: 5
};
var map = new google.maps.Map(mapCanvas, mapOptions);
}
if ($("#map-marker").length){
var mapCanvas = document.getElementById("map-marker");
var mapOptions = {
center: new google.maps.LatLng(51.508742,-0.120850),
zoom: 5
};
var marker = new google.maps.Marker({
position: new google.maps.LatLng(51.508742,-0.120850),
animation:google.maps.Animation.BOUNCE
});
var map = new google.maps.Map(mapCanvas, mapOptions);
marker.setMap(map);
}
if ($("#map-poly").length){
var stavanger = new google.maps.LatLng(58.983991,5.734863);
var amsterdam = new google.maps.LatLng(52.395715,4.888916);
var london = new google.maps.LatLng(51.508742,-0.120850);
var mapCanvas = document.getElementById("map-poly");
var mapOptions = {center: amsterdam, zoom: 4};
var map = new google.maps.Map(mapCanvas,mapOptions);
var flightPath = new google.maps.Polyline({
path: [stavanger, amsterdam, london],
strokeColor: "#0000FF",
strokeOpacity: 0.8,
strokeWeight: 2
});
flightPath.setMap(map);
}
if ($("#map-polygon").length){
var stavanger = new google.maps.LatLng(58.983991,5.734863);
var amsterdam = new google.maps.LatLng(52.395715,4.888916);
var london = new google.maps.LatLng(51.508742,-0.120850);
var mapCanvas = document.getElementById("map-polygon");
var mapOptions = {center: amsterdam, zoom: 4};
var map = new google.maps.Map(mapCanvas,mapOptions);
var flightPath = new google.maps.Polygon({
path: [stavanger, amsterdam, london],
strokeColor: "#0000FF",
strokeOpacity: 0.8,
strokeWeight: 2,
fillColor: "#0000FF",
fillOpacity: 0.4
});
flightPath.setMap(map);
}
if($("#map-circle").length){
var amsterdam = new google.maps.LatLng(52.395715,4.888916);
var mapCanvas = document.getElementById("map-circle");
var mapOptions = {center: amsterdam, zoom: 7};
var map = new google.maps.Map(mapCanvas,mapOptions);
var myCity = new google.maps.Circle({
center: amsterdam,
radius: 50000,
strokeColor: "#0000FF",
strokeOpacity: 0.8,
strokeWeight: 2,
fillColor: "#0000FF",
fillOpacity: 0.4
});
myCity.setMap(map);
}
if($("#map-info").length){
var myCenter = new google.maps.LatLng(51.508742,-0.120850);
var mapCanvas = document.getElementById("map-info");
var mapOptions = {center: myCenter, zoom: 5};
var map = new google.maps.Map(mapCanvas, mapOptions);
var marker = new google.maps.Marker({position:myCenter});
marker.setMap(map);
var infowindow = new google.maps.InfoWindow({
content: "Hello World!"
});
infowindow.open(map,marker);
}
if ($("#map-hybrid").length){
var mapCanvas = document.getElementById("map-hybrid");
var mapOptions = {
center: new google.maps.LatLng(51.508742,-0.120850),
zoom: 5,
mapTypeId: google.maps.MapTypeId.HYBRID
};
var map = new google.maps.Map(mapCanvas, mapOptions);
}
if ($("#map-45").length){
var mapCanvas = document.getElementById("map-45");
var mapOptions = {
center: new google.maps.LatLng(45.434046,12.340284),
zoom:18,
mapTypeId:google.maps.MapTypeId.HYBRID
};
var map = new google.maps.Map(mapCanvas,mapOptions);
}
if ($("#map-light-dream").length){
var myCenter = new google.maps.LatLng(40.6700, -73.9400);
var mapOptions = {
zoom: 11,
center: new google.maps.LatLng(40.6700, -73.9400),
styles: [
{
"featureType": "landscape",
"stylers": [
{
"hue": "#FFBB00"
},
{
"saturation": 43.400000000000006
},
{
"lightness": 37.599999999999994
},
{
"gamma": 1
}
]
},
{
"featureType": "road.highway",
"stylers": [
{
"hue": "#FFC200"
},
{
"saturation": -61.8
},
{
"lightness": 45.599999999999994
},
{
"gamma": 1
}
]
},
{
"featureType": "road.arterial",
"stylers": [
{
"hue": "#FF0300"
},
{
"saturation": -100
},
{
"lightness": 51.19999999999999
},
{
"gamma": 1
}
]
},
{
"featureType": "road.local",
"stylers": [
{
"hue": "#FF0300"
},
{
"saturation": -100
},
{
"lightness": 52
},
{
"gamma": 1
}
]
},
{
"featureType": "water",
"stylers": [
{
"hue": "#0078FF"
},
{
"saturation": -13.200000000000003
},
{
"lightness": 2.4000000000000057
},
{
"gamma": 1
}
]
},
{
"featureType": "poi",
"stylers": [
{
"hue": "#00FF6A"
},
{
"saturation": -1.0989010989011234
},
{
"lightness": 11.200000000000017
},
{
"gamma": 1
}
]
}
]
};
// Get the HTML DOM element that will contain your map
// We are using a div with id="map" seen below in the <body>
var mapElement = document.getElementById('map-light-dream');
// Create the Google Map using our element and options defined above
var map = new google.maps.Map(mapElement, mapOptions);
var marker = new google.maps.Marker({position:myCenter});
marker.setMap(map);
}
if ($("#map-blue-essence").length){
var myCenter = new google.maps.LatLng(40.6700, -73.9400);
var mapOptions = {
zoom: 11,
center: new google.maps.LatLng(40.6700, -73.9400),
styles: [
{
"featureType": "landscape.natural",
"elementType": "geometry.fill",
"stylers": [
{
"visibility": "on"
},
{
"color": "#e0efef"
}
]
},
{
"featureType": "poi",
"elementType": "geometry.fill",
"stylers": [
{
"visibility": "on"
},
{
"hue": "#1900ff"
},
{
"color": "#c0e8e8"
}
]
},
{
"featureType": "road",
"elementType": "geometry",
"stylers": [
{
"lightness": 100
},
{
"visibility": "simplified"
}
]
},
{
"featureType": "road",
"elementType": "labels",
"stylers": [
{
"visibility": "off"
}
]
},
{
"featureType": "transit.line",
"elementType": "geometry",
"stylers": [
{
"visibility": "on"
},
{
"lightness": 700
}
]
},
{
"featureType": "water",
"elementType": "all",
"stylers": [
{
"color": "#7dcdcd"
}
]
}
]
};
// Get the HTML DOM element that will contain your map
// We are using a div with id="map" seen below in the <body>
var mapElement = document.getElementById('map-blue-essence');
// Create the Google Map using our element and options defined above
var map = new google.maps.Map(mapElement, mapOptions);
var marker = new google.maps.Marker({position:myCenter});
marker.setMap(map);
}
if ($("#map-midnight-commander").length){
var myCenter = new google.maps.LatLng(40.6700, -73.9400);
var mapOptions = {
zoom: 11,
center: new google.maps.LatLng(40.6700, -73.9400),
styles: [{"featureType":"all","elementType":"labels.text.fill","stylers":[{"color":"#ffffff"}]},{"featureType":"all","elementType":"labels.text.stroke","stylers":[{"color":"#000000"},{"lightness":13}]},{"featureType":"administrative","elementType":"geometry.fill","stylers":[{"color":"#000000"}]},{"featureType":"administrative","elementType":"geometry.stroke","stylers":[{"color":"#144b53"},{"lightness":14},{"weight":1.4}]},{"featureType":"landscape","elementType":"all","stylers":[{"color":"#08304b"}]},{"featureType":"poi","elementType":"geometry","stylers":[{"color":"#0c4152"},{"lightness":5}]},{"featureType":"road.highway","elementType":"geometry.fill","stylers":[{"color":"#000000"}]},{"featureType":"road.highway","elementType":"geometry.stroke","stylers":[{"color":"#0b434f"},{"lightness":25}]},{"featureType":"road.arterial","elementType":"geometry.fill","stylers":[{"color":"#000000"}]},{"featureType":"road.arterial","elementType":"geometry.stroke","stylers":[{"color":"#0b3d51"},{"lightness":16}]},{"featureType":"road.local","elementType":"geometry","stylers":[{"color":"#000000"}]},{"featureType":"transit","elementType":"all","stylers":[{"color":"#146474"}]},{"featureType":"water","elementType":"all","stylers":[{"color":"#021019"}]}]
};
// Get the HTML DOM element that will contain your map
// We are using a div with id="map" seen below in the <body>
var mapElement = document.getElementById('map-midnight-commander');
// Create the Google Map using our element and options defined above
var map = new google.maps.Map(mapElement, mapOptions);
var marker = new google.maps.Marker({position:myCenter});
marker.setMap(map);
}
if ($("#map-flat").length){
var myCenter = new google.maps.LatLng(40.6700, -73.9400);
var mapOptions = {
zoom: 11,
center: new google.maps.LatLng(40.6700, -73.9400),
styles: [{"featureType":"all","elementType":"labels","stylers":[{"visibility":"off"}]},{"featureType":"landscape","elementType":"all","stylers":[{"visibility":"on"},{"color":"#f3f4f4"}]},{"featureType":"landscape.man_made","elementType":"geometry","stylers":[{"weight":0.9},{"visibility":"off"}]},{"featureType":"poi.park","elementType":"geometry.fill","stylers":[{"visibility":"on"},{"color":"#83cead"}]},{"featureType":"road","elementType":"all","stylers":[{"visibility":"on"},{"color":"#ffffff"}]},{"featureType":"road","elementType":"labels","stylers":[{"visibility":"off"}]},{"featureType":"road.highway","elementType":"all","stylers":[{"visibility":"on"},{"color":"#fee379"}]},{"featureType":"road.arterial","elementType":"all","stylers":[{"visibility":"on"},{"color":"#fee379"}]},{"featureType":"water","elementType":"all","stylers":[{"visibility":"on"},{"color":"#7fc8ed"}]}]
};
// Get the HTML DOM element that will contain your map
// We are using a div with id="map" seen below in the <body>
var mapElement = document.getElementById('map-flat');
// Create the Google Map using our element and options defined above
var map = new google.maps.Map(mapElement, mapOptions);
var marker = new google.maps.Marker({position:myCenter});
marker.setMap(map);
}
})(jQuery);