Soledade Maps BI

by edgardleal

HTML

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&amp;sensor=false"></script>
<div id="map-canvas"></div>

CSS

html, body, #map-canvas {
        height: 100%;
        margin: 0px;
        padding: 0px;
    background : #000;
      }

JavaScript

var MY_MAPTYPE_ID = 'custom_style';
var url_api = 'http://maps.google.com/maps/api/geocode/json?address=Pituba+Salvador+bahia&sensor=false&region=BR';

var map;
var icons = {
    
    green : 'https://s3-sa-east-1.amazonaws.com/megasystem/img/green_point.png',
    red   : 'https://s3-sa-east-1.amazonaws.com/megasystem/img/red_point.gif',
    blue  : 'https://s3-sa-east-1.amazonaws.com/megasystem/img/yellow_point.png'
};

function initialize() {
  var featureOpts = [
    {
      stylers: [
        //{ hue: '#890000' },
        //{ visibility: 'simplified' }
        //{ gamma: 0.5 },
        //{ weight: 0.5 }
      ]
    },
    {
      elementType: 'labels',
      stylers: [
        { visibility: 'off' }
      ]
    },
    {
      featureType: 'water',
      stylers: [
       // { color: '#890000' }
      ]
    }
  ];

  map = new google.maps.Map(document.getElementById('map-canvas'),
      mapOptions);

  var styledMapOptions = {
    name: 'Custom Style'
  };
    
  var mapOptions = {
       zoom: 6,
       center: new google.maps.LatLng(-13.4343696,-41.982751),
       mapTypeId: MY_MAPTYPE_ID
  };
  map = new google.maps.Map(document.getElementById('map-canvas'),
      mapOptions);
    
      var customMapType = new google.maps.StyledMapType(featureOpts, styledMapOptions);

      var beachMarker = new google.maps.Marker({
        position: new google.maps.LatLng(-13.2288403,-39.5047077),
        map: map,
          title : 'MutuĂ­pe',
          animation: google.maps.Animation.BOUNCE,
        icon: icons.red
      });
               
    var beachMarkerPituba = new google.maps.Marker({
        position: new google.maps.LatLng(-12.9994819,-38.4560755),
        map: map,
        icon: icons.blue
      });
    
    var markerLauroFreitas = new google.maps.Marker({
        position: new google.maps.LatLng(-12.8898929, -38.3153193),
        map: map,
        title : 'Lauro de Freitas', 
        icon: icons.green,
        draggable:true,
        animation:...