TECHNOLOGIES
FORUMS
JOBS
BOOKS
EVENTS
INTERVIEWS
Live
MORE
LEARN
Training
CAREER
MEMBERS
VIDEOS
NEWS
BLOGS
Sign Up
Login
No unread comment.
View All Comments
No unread message.
View All Messages
No unread notification.
View All Notifications
Answers
Post
An Article
A Blog
A News
A Video
An EBook
An Interview Question
Ask Question
Forums
Monthly Leaders
Forum guidelines
Sahil Taneja
NA
2
974
In this Google map to disable the mapTypeControl
May 21 2015 7:14 AM
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Hello Transit</title>
<link rel="stylesheet" href="themes/petato.min.css" />
<link rel="stylesheet" href="themes/jquery.mobile.icons.min.css" />
<link rel="stylesheet" href="themes/jquery.mobile.structure.min.css" />
<script src="themes/jquery.min.js"></script>
<script src="themes/jquery.mobile.min.js"></script>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
function Gettype() {
var url = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
for (var i = 0; i < url.length; i++) {
var urlparam = url[i].split('=');
if (urlparam[0] != null) {
return urlparam[1];
}
}
}
function Getsource() {
var url = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
for (var i = 1; i < url.length; i++) {
var urlparam = url[i].split('=');
if (urlparam[0] != null) {
return urlparam[1];
}
}
}
function Getdest() {
var url = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
for (var i = 2; i < url.length; i++) {
var urlparam = url[i].split('=');
if (urlparam[0] != null) {
return urlparam[1];
}
}
}
function Getlat() {
var url = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
for (var i = 3; i < url.length; i++) {
var urlparam = url[i].split('=');
if (urlparam[0] != null) {
return urlparam[1];
}
}
}
function Getlng() {
var url = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
for (var i = 4; i < url.length; i++) {
var urlparam = url[i].split('=');
if (urlparam[0] != null) {
return urlparam[1];
}
}
}
var lat=Getlat();
var lng=Getlng();
alert(lat);
alert(lng);
var type=Gettype();
var source=Getsource();
var dest=Getdest();
alert("source "+source);
alert("dest "+dest);
alert("type "+type);
var myCenter=new google.maps.LatLng(lat,lng);
//alert(myCenter);
</script>
</head>
<script>
// When the window has finished loading create our google map below
/* google.maps.event.addDomListener(window, 'load', init);
function init() {
// Basic options for a simple Google Map
// For more options see: https://developers.google.com/maps/documentation/javascript/reference#MapOptions
var mapOptions = {
// How zoomed in you want the map to start at (always required)
zoom: 17,
// The latitude and longitude to center the map (always required)
center: new google.maps.LatLng(40.6700, -73.9400), // New York
// How you would like to style the map.
// This is where you would paste any style found on Snazzy Maps.
styles: [{"featureType":"administrative","elementType":"geometry.fill","stylers":[{"visibility":"on"}]},{"featureType":"administrative","elementType":"geometry.stroke","stylers":[{"visibility":"on"}]},{"featureType":"administrative","elementType":"labels.text","stylers":[{"visibility":"on"}]},{"featureType":"administrative","elementType":"labels.text.fill","stylers":[{"color":"#444444"}]},{"featureType":"administrative.neighborhood","elementType":"geometry.fill","stylers":[{"weight":"0.73"}]},{"featureType":"landscape","elementType":"all","stylers":[{"color":"#f2f2f2"}]},{"featureType":"landscape","elementType":"geometry","stylers":[{"visibility":"on"}]},{"featureType":"landscape.man_made","elementType":"all","stylers":[{"visibility":"on"}]},{"featureType":"landscape.natural","elementType":"all","stylers":[{"visibility":"on"},{"color":"#469b40"},{"lightness":"47"}]},{"featureType":"landscape.natural","elementType":"geometry","stylers":[{"visibility":"on"}]},{"featureType":"landscape.natural.landcover","elementType":"geometry","stylers":[{"visibility":"on"}]},{"featureType":"landscape.natural.landcover","elementType":"geometry.fill","stylers":[{"visibility":"on"}]},{"featureType":"landscape.natural.terrain","elementType":"geometry.fill","stylers":[{"visibility":"on"}]},{"featureType":"landscape.natural.terrain","elementType":"geometry.stroke","stylers":[{"visibility":"on"}]},{"featureType":"poi","elementType":"all","stylers":[{"visibility":"off"},{"color":"#914956"}]},{"featureType":"poi.attraction","elementType":"all","stylers":[{"visibility":"on"}]},{"featureType":"poi.business","elementType":"all","stylers":[{"visibility":"on"}]},{"featureType":"poi.government","elementType":"all","stylers":[{"visibility":"on"}]},{"featureType":"poi.medical","elementType":"all","stylers":[{"visibility":"on"}]},{"featureType":"poi.park","elementType":"all","stylers":[{"visibility":"on"},{"weight":"0.13"},{"saturation":"-28"},{"color":"#469b40"},{"lightness":"64"}]},{"featureType":"poi.park","elementType":"labels.text","stylers":[{"color":"#000000"}]},{"featureType":"poi.place_of_worship","elementType":"all","stylers":[{"visibility":"on"}]},{"featureType":"poi.school","elementType":"all","stylers":[{"visibility":"on"}]},{"featureType":"poi.sports_complex","elementType":"all","stylers":[{"visibility":"on"}]},{"featureType":"road","elementType":"all","stylers":[{"saturation":-100},{"lightness":45},{"visibility":"on"},{"color":"#a6a6a6"}]},{"featureType":"road.highway","elementType":"all","stylers":[{"visibility":"simplified"}]},{"featureType":"road.arterial","elementType":"labels.icon","stylers":[{"visibility":"off"}]},{"featureType":"transit","elementType":"all","stylers":[{"visibility":"off"}]},{"featureType":"transit","elementType":"geometry.fill","stylers":[{"visibility":"on"}]},{"featureType":"water","elementType":"all","stylers":[{"visibility":"on"}]}]
};
// 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');
// Create the Google Map using our element and options defined above
var map = new google.maps.Map(mapElement, mapOptions);
// Let's also add a marker while we're at it
var marker = new google.maps.Marker({
position: new google.maps.LatLng(40.6710, -73.9400),
map: map,
title: 'Snazzy!'
});
}
*/
</script>
<style type="text/css">
@font-face {
font-family: myFirstFont;
src: url(themes/allerlight.ttf)!important;
}
body, input, select, textarea, button, .ui-btn {
font-size: 1em!important;
line-height: 1.3!important;
font-family: myfirstfont!important;
}
.ui-header-fixed {
top: 0px!important;
padding-top: 5px!important;
}
.ui-btn {
font-size: 15px!important;
color: #fff!important;
text-shadow: none!important; }
.uibtn1 { padding-top: 45px!important; }
.uibtn2 { padding-top: 45px!important; }
.uibtn3 { padding-top: 45px!important; }
.uibtn4 { padding-top: 45px!important; }
.ui-icon-homes {
background: url(themes/images/homes.png) 50% 30% no-repeat;
background-size: 30px 30px;
border-radius:0px!important;
-moz-border-radius:0px!important;
-webkit-border-radius:0px!important;
-ms-border-radius:0px!important;
-o-border-radius:0px!important;
}
.ui-icon-stars {
background: url(themes/images/stars.png) 50% 30% no-repeat;
background-size: 28px 28px;
border-radius:0px!important;
-moz-border-radius:0px!important;
-webkit-border-radius:0px!important;
-ms-border-radius:0px!important;
-o-border-radius:0px!important;
}
.ui-icon-bar {
background: url(themes/images/bar.png) 50% 30% no-repeat;
background-size: 30px 30px;
border-radius:0px!important;
-moz-border-radius:0px!important;
-webkit-border-radius:0px!important;
-ms-border-radius:0px!important;
-o-border-radius:0px!important;
}
.ui-icon-earth {
background: url(globe.png) 50% 30% no-repeat;
background-size: 30px 30px;
border-radius:0px!important;
-moz-border-radius:0px!important;
-webkit-border-radius:0px!important;
-ms-border-radius:0px!important;
-o-border-radius:0px!important;
}
body, input, select, textarea, button, .ui-btn {
font-size: 1em;
line-height: 1.3!important;
}
.ui-bar-b, .ui-page-theme-b .ui-bar-inherit, html .ui-bar-b .ui-bar-inherit, html .ui-body-b .ui-bar-inherit, html body .ui-group-theme-b .ui-bar-inherit {
background-color: transparent!important;
border-top: medium none transparent;
}
body, input, select, textarea, button, .ui-btn {
font-size: 1em;
line-height: 0.3; }
.ui-content {
border-width: 0;
overflow: visible;
overflow-x: hidden;
padding: 0em;
}
#map {
width: 750px;
height: 500px;
}
h1 { color: #000!important; }
.ui-bar-b, .ui-page-theme-b .ui-bar-inherit, html .ui-bar-b .ui-bar-inherit, html .ui-body-b .ui-bar-inherit, html body .ui-group-theme-b .ui-bar-inherit { background-color: #fff; }
.iconleft { border:none!important;
background-color: transparent!important;
box-shadow: none;
margin-top: 2px!important;
}
.ui-btn:focus { box-shadow:none!important;
text-shadow: none!important;
border:none; }
h1, p { color: #fff;
text-shadow: none; }
.ui-btn { background-color: #00bce2!important;
text-shadow: none!important;
border:none; }
</style>
</head>
<body style="font-family: Arial; font-size: 12px;">
<div data-role="page" data-theme="b">
<div data-role="header" data-position="fixed">
<a href="#" class="ui-btn ui-icon-bars ui-btn-icon-left ui-shadow ui-corner-all ui-nodisc-icon ui-btn-icon-notext ui-alt-icon iconleft" style="background-color:transparent!important;">bars</a>
<a href="index.html" data-rel="back" class="ui-btn ui-icon-search ui-btn-icon-left ui-shadow ui-corner-all ui-nodisc-icon ui-btn-icon-notext ui-alt-icon iconleft" style="background-color:transparent!important;">search</a>
<h1>Destination</h1>
</div>
<!--
<div data-role="content">
<div id="map" style="width:108%; height:787px;"></div>
</div>
-->
<div style="width: 600px;">
<div id="map" style="width: 570px; height: 400px; float: left;"><br/></div> <br/><br/><br/><br/> <br/><br/><br/><br/> <br/><br/><br/><br/> <br/><br/><br/><br/> <br/><br/><br/><br/> <br/>
<div><h1 id="s"></h1>
<h1 id="st"> </h1>
<h1 id="text"></h1></div>
<div id="panel" style="width: 300px; float: left;"></div>
</div>
<div>
<br/>
<script type="text/javascript">
//alert("get"+a);
if(type=="car")
{
alert("dfsffffffffffffffffffffffffff safddddddddd afdddddddddg");
}
var directionsService = new google.maps.DirectionsService();
var directionsDisplay = new google.maps.DirectionsRenderer();
var distancetime;
var map = new google.maps.Map(document.getElementById('map'), {
zoom:7,
mapTypeId: google.maps.MapTypeId.ROADMAP
mapTypeControl: false,
streetViewControl: false,
});
directionsDisplay.setMap(map);
directionsDisplay.setMap( mapTypeControl: false);
//document.write("\n\n");
//document.getElementById('s').innerHTML;
directionsDisplay.setPanel(document.getElementById('panel'));
var request = {
//origin: 'PITAMPURA',
//destination: 'ASHOK VIHAR',
origin: myCenter,
destination: dest,
//var type1;
//travelMode: google.maps.DirectionsTravelMode.DRIVING
travelMode: google.maps.DirectionsTravelMode.TRANSIT
//travelMode: google.maps.DirectionsTravelMode.WALKING
//travelMode: google.maps.DirectionsTravelMode.BICYCLING
};
directionsService.route(request, function(response, status) {
if (status == google.maps.DirectionsStatus.OK) {
directionsDisplay.setDirections(response);
}
var address=response.routes[0].legs[0].start_address;
distancetime=response.routes[0].legs[0].distance['text'];
var timeduration=response.routes[0].legs[0].duration['text'];
alert("address:"+address);
alert("distance:"+distancetime);
alert("time:"+timeduration);
var myRoute = response.routes[0].legs[0];
for (var i = 0; i < myRoute.steps.length; i++) {
alert(myRoute.steps[i].instructions);
}
/*<span jsdisplay="distance" jscontent="distance['text']" jstcache="7">5.6 km</span>*/
var s=document.getElementById('st').innerHTML=address;
var d=document.getElementById('text').innerHTML=distancetime+'-about'+timeduration;
});
</script>
<br/>
</div>
<div data-role="footer" data-position="fixed" data-inset="true">
<div data-role="navbar">
<ul style="margin-bottom:-1px;">
<li><a href="" rel="external" class="ui-btn uibtn1 ui-icon ui-icon-homes ui-nodisc-icon ui-alt-icon ui-btn-icon-top">Home</a></li>
<li><a href="" rel="external" class="ui-btn uibtn2 ui-icon ui-icon-stars ui-nodisc-icon ui-alt-icon ui-btn-icon-top">Favourites</a></li>
<li><a href="" rel="external" class="ui-btn uibtn3 ui-icon ui-icon-earth ui-nodisc-icon ui-alt-icon ui-btn-icon-top">Explore</a></li>
<li><a href="departures.html" rel="external" class="ui-btn uibtn4 ui-icon ui-icon-bar ui-nodisc-icon ui-alt-icon ui-btn-icon-top">More</a></li>
</ul>
</div>
</div>
</div>
</body>
</html>
Reply
Answers (
0
)
Anchor Tag enable using Jquery
create dynamic div in a div