I'm trying to style up a Google Map to match a design I've been given, and on the design there is a stroke around the outside of all the countries, as well as a stroke on dividing borders.
The effect I'm going for is as below:
My code for the styling is currently as follows:
var styles = [
{
featureType: "water",
stylers: [
{ visibility: "on" },
{ color: "#ffffff" }
]
},{
featureType: "landscape",
stylers: [
{ color: "#f7f7f5" }
]
},{
featureType: "road",
stylers: [
{ visibility: "off" }
]
},{
featureType: "poi",
stylers: [
{ visibility: "off" }
]
},{
featureType: "administrative.country",
stylers: [
{ color: "#d2cdcd" },
{ weight: 1 }
]
},{
featureType: "administrative.country",
elementType: "labels",
stylers: [
{ visibility: "off" }
]
},{
featureType: "administrative.province",
elementType: "geometry",
stylers: [
{ visibility: "off" }
]
},{
featureType: "administrative.locality",
elementType: "labels",
stylers: [
{ visibility: "off" }
]
},{
featureType: "administrative.province",
elementType: "labels",
stylers: [
{ visibility: "off" }
]
},{
featureType: "water",
elementType: "geometry.stroke",
stylers: [
{ color: "#4cfff5" }
]
}
];
Any idea if what I am after is possible?
Thanks!
EDIT: The above styles give me the following
The Google Maps APIs now support you in creating beautiful styled maps for your Android and iOS apps as well as your website using the same JSON style object.
Create a new styleIn the Google Cloud Console, go to the Map Styles page. Click Create Style, and choose the Google Map radio button. Click Save. In the Save and Publish Map dialog, enter a map name and optional description, and click Save.
You currently can only define the fill for water but not the outline.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With