我用了使用谷歌地图的编辑服务从这里开始:https://developers.google.com/maps/documentation/javascript/styling如何嵌入风格的谷歌地图在您的网站
现在这个链接给我提供了两件事情:1。 一个JSON代码 2.谷歌的API链接
,但我不知道如何在我的HTML中使用JSON,在我的网站从JavaScript前,我才嵌入简单的谷歌地图[类似变种谷歌新地图。 PLZ帮助我将这个JSON代码添加到我的JavaScript或HTML。
这里是JSON代码
[
{
"elementType": "geometry",
"stylers": [
{
"color": "#242f3e"
}
]
},
{
"elementType": "labels.text.fill",
"stylers": [
{
"color": "#746855"
}
]
},
{
"elementType": "labels.text.stroke",
"stylers": [
{
"color": "#242f3e"
}
]
},
{
"featureType": "administrative.country",
"elementType": "geometry",
"stylers": [
{
"color": "#af01ab"
}
]
},
{
"featureType": "administrative.locality",
"elementType": "geometry",
"stylers": [
{
"color": "#fe70fb"
}
]
},
{
"featureType": "administrative.locality",
"elementType": "labels.text.fill",
"stylers": [
{
"color": "#d59563"
}
]
},
{
"featureType": "administrative.province",
"elementType": "geometry",
"stylers": [
{
"color": "#fe01f8"
}
]
},
{
"featureType": "poi",
"elementType": "labels.text.fill",
"stylers": [
{
"color": "#d59563"
}
]
},
{
"featureType": "poi.park",
"elementType": "geometry",
"stylers": [
{
"color": "#169c03"
}
]
},
{
"featureType": "poi.park",
"elementType": "labels.text.fill",
"stylers": [
{
"color": "#6b9a76"
}
]
},
{
"featureType": "road",
"elementType": "geometry",
"stylers": [
{
"color": "#38414e"
}
]
},
{
"featureType": "road",
"elementType": "geometry.stroke",
"stylers": [
{
"color": "#212a37"
}
]
},
{
"featureType": "road",
"elementType": "labels.text.fill",
"stylers": [
{
"color": "#9ca5b3"
}
]
},
{
"featureType": "road.arterial",
"elementType": "geometry",
"stylers": [
{
"color": "#7274d3"
}
]
},
{
"featureType": "road.highway",
"elementType": "geometry",
"stylers": [
{
"color": "#4d4ddb"
}
]
},
{
"featureType": "road.highway",
"elementType": "geometry.stroke",
"stylers": [
{
"color": "#1f2835"
}
]
},
{
"featureType": "road.highway",
"elementType": "labels.text.fill",
"stylers": [
{
"color": "#f3d19c"
}
]
},
{
"featureType": "road.local",
"elementType": "geometry",
"stylers": [
{
"color": "#9898b8"
}
]
},
{
"featureType": "transit",
"elementType": "geometry",
"stylers": [
{
"color": "#2f3948"
}
]
},
{
"featureType": "transit.line",
"elementType": "geometry",
"stylers": [
{
"color": "#fafe52"
}
]
},
{
"featureType": "transit.station",
"elementType": "labels.text.fill",
"stylers": [
{
"color": "#d59563"
}
]
},
{
"featureType": "transit.station.rail",
"elementType": "geometry",
"stylers": [
{
"color": "#fafe52"
}
]
},
{
"featureType": "water",
"elementType": "geometry",
"stylers": [
{
"color": "#169ba3"
}
]
},
{
"featureType": "water",
"elementType": "labels.text.fill",
"stylers": [
{
"color": "#515c6d"
}
]
},
{
"featureType": "water",
"elementType": "labels.text.stroke",
"stylers": [
{
"color": "#17263c"
}
]
}
]
,这是link
https://maps.googleapis.com/maps/api/staticmap?key=YOUR_API_KEY¢er=29.921068146058925,433.86609008312223&zoom=17&format=png&maptype=roadmap&style=element:geometry%7Ccolor:0x242f3e&style=element:labels.text.fill%7Ccolor:0x746855&style=element:labels.text.stroke%7Ccolor:0x242f3e&style=feature:administrative.country%7Celement:geometry%7Ccolor:0xaf01ab&style=feature:administrative.locality%7Celement:geometry%7Ccolor:0xfe70fb&style=feature:administrative.locality%7Celement:labels.text.fill%7Ccolor:0xd59563&style=feature:administrative.province%7Celement:geometry%7Ccolor:0xfe01f8&style=feature:poi%7Celement:labels.text.fill%7Ccolor:0xd59563&style=feature:poi.park%7Celement:geometry%7Ccolor:0x169c03&style=feature:poi.park%7Celement:labels.text.fill%7Ccolor:0x6b9a76&style=feature:road%7Celement:geometry%7Ccolor:0x38414e&style=feature:road%7Celement:geometry.stroke%7Ccolor:0x212a37&style=feature:road%7Celement:labels.text.fill%7Ccolor:0x9ca5b3&style=feature:road.arterial%7Celement:geometry%7Ccolor:0x7274d3&style=feature:road.highway%7Celement:geometry%7Ccolor:0x4d4ddb&style=feature:road.highway%7Celement:geometry.stroke%7Ccolor:0x1f2835&style=feature:road.highway%7Celement:labels.text.fill%7Ccolor:0xf3d19c&style=feature:road.local%7Celement:geometry%7Ccolor:0x9898b8&style=feature:transit%7Celement:geometry%7Ccolor:0x2f3948&style=feature:transit.line%7Celement:geometry%7Ccolor:0xfafe52&style=feature:transit.station%7Celement:labels.text.fill%7Ccolor:0xd59563&style=feature:transit.station.rail%7Celement:geometry%7Ccolor:0xfafe52&style=feature:water%7Celement:geometry%7Ccolor:0x169ba3&style=feature:water%7Celement:labels.text.fill%7Ccolor:0x515c6d&style=feature:water%7Celement:labels.text.stroke%7Ccolor:0x17263c&size=480x360
你需要为这个 –
谷歌地图API密钥请参见here @IsmailFarooq我有我的api密钥,但如何添加json –
您提供的网址缺少API KEY“YOUR_A PI_KEY“请参阅示例https://jsfiddle.net/api/post/library/pure/ –