javascript - Style google maps -


i have fowlling google map created own icon. code fowlling:

https://paste.ee/p/o3u44

however want ot add style silver, i'm not sure how modify code.

any apprecaited.

thanks!

please follow code.

here need add google api key in below link.

src="https://maps.googleapis.com/maps/api/jskey=your_api_key&callback=initmap"

here code.

var map;        function initmap() {          map = new google.maps.map(document.getelementbyid('map'), {            zoom: 16,            center: new google.maps.latlng(38.769671, -9.097975),            maptypeid: 'roadmap',            styles : [    {      "elementtype": "geometry",      "stylers": [        {          "color": "#f5f5f5"        }      ]    },    {      "elementtype": "labels.icon",      "stylers": [        {          "visibility": "off"        }      ]    },    {      "elementtype": "labels.text.fill",      "stylers": [        {          "color": "#616161"        }      ]    },    {      "elementtype": "labels.text.stroke",      "stylers": [        {          "color": "#f5f5f5"        }      ]    },    {      "featuretype": "administrative.land_parcel",      "elementtype": "labels.text.fill",      "stylers": [        {          "color": "#bdbdbd"        }      ]    },    {      "featuretype": "poi",      "elementtype": "geometry",      "stylers": [        {          "color": "#eeeeee"        }      ]    },    {      "featuretype": "poi",      "elementtype": "labels.text.fill",      "stylers": [        {          "color": "#757575"        }      ]    },    {      "featuretype": "poi.park",      "elementtype": "geometry",      "stylers": [        {          "color": "#e5e5e5"        }      ]    },    {      "featuretype": "poi.park",      "elementtype": "labels.text.fill",      "stylers": [        {          "color": "#9e9e9e"        }      ]    },    {      "featuretype": "road",      "elementtype": "geometry",      "stylers": [        {          "color": "#ffffff"        }      ]    },    {      "featuretype": "road.arterial",      "elementtype": "labels.text.fill",      "stylers": [        {          "color": "#757575"        }      ]    },    {      "featuretype": "road.highway",      "elementtype": "geometry",      "stylers": [        {          "color": "#dadada"        }      ]    },    {      "featuretype": "road.highway",      "elementtype": "labels.text.fill",      "stylers": [        {          "color": "#616161"        }      ]    },    {      "featuretype": "road.local",      "elementtype": "labels.text.fill",      "stylers": [        {          "color": "#9e9e9e"        }      ]    },    {      "featuretype": "transit.line",      "elementtype": "geometry",      "stylers": [        {          "color": "#e5e5e5"        }      ]    },    {      "featuretype": "transit.station",      "elementtype": "geometry",      "stylers": [        {          "color": "#eeeeee"        }      ]    },    {      "featuretype": "water",      "elementtype": "geometry",      "stylers": [        {          "color": "#c9c9c9"        }      ]    },    {      "featuretype": "water",      "elementtype": "labels.text.fill",      "stylers": [        {          "color": "#9e9e9e"        }      ]    }  ]          });                       var iconbase = 'https://maps.google.com/mapfiles/kml/shapes/';          var icons = {            info: {              icon: 'https://novo2.rhp.pt/map.png'            }          };             var features = [            {              position: new google.maps.latlng(38.769671, -9.097975),              type: 'info'            }          ];             // create markers.          features.foreach(function(feature) {            var marker = new google.maps.marker({              position: feature.position,              icon: icons[feature.type].icon,              map: map,              content:'<div>test</div>'                          });          });        }
 /* set map height explicitly define size of div         * element contains map. */        #map {          height: 100%;        }        /* optional: makes sample page fill window. */        html, body {          height: 100%;          margin: 0;          padding: 0;        }
<div id="map"></div>  <script async defer     src="https://maps.googleapis.com/maps/api/js?key=your_api_key&callback=initmap">      </script>

if wanted still changes map style follow link https://mapstyle.withgoogle.com/ , create whatever want , copy whole json code , replace in above stylesobject.

hope helps.


Comments

Post a Comment

Popular posts from this blog

php - Vagrant up error - Uncaught Reflection Exception: Class DOMDocument does not exist -

i've set bento/ubuntu-16.04 vagrant box using php 5.6, , getting following error quite few times when try , run shell script: "uncaught reflection exception: class domdocument not exist". i've tried adding following top of script (not together), each no success: "sudo apt-get install php5.6-xml", "sudo apt-get install php5-xml", "sudo apt-get install php-dom" i've tried resetting server "sudo service apache2 restart". does have suggestions?
Read more

vue.js - Create hooks for automated testing -

Image
qa guys complained can't automate frontend testing. because our html looks same outside. lazy hack did this <template> <div :role="$options.name"> ... </div> </template> <script> export default { name: 'vmcomponentname' } </script> which takes name script , applies html. in browser get: <div role="vmcomponentname"> ... </div> line :role="$options.name" goes in every component. is there dry er solutions? please share. additional details i'll explain in details looking for. imagine have vmusercreate form creates user. test case can create user . to automatically test without role, have use following selector: .wrapper > .wrapper > .wrapper > .submit-button the test extremely brittle (will break lot). if use roles can use [role="vmusercreateform"] .submit-button selector. many folds less brittle. so basically, i'm ...
Read more

Add new key value to json node in java -

i have json file : { "id":1, "name":"abc", "addressdetails": { "city":"newyork" } } i wanted add 1 more key-value ("pincode" : "414141") node 'addressdetails'. i tried using : objectmapper mapper = new objectmapper(); jsonnode root = mapper.readtree(new file("d://test.json")); objectnode node = mapper.createobjectnode(); node.with("addressdetails").put("pincode", "414141"); but it's not getting added, there way can ? you can try you should modify file path objectmapper mapper = new objectmapper(); objectnode nodes = mapper.readvalue(new file("d:\\test.txt"), objectnode.class); nodes.with("addressdetails").put("pincode", "414141"); mapper.writer().writevalue(new file("d:\\test.txt"), nodes);
Read more