Recent Posts / Category : web
「Google Mapの埋め込みでライバル店の表示を消したいんだけど」
というような依頼をいただきまして
そんなんできるんかなーといろいろググったら
gmaps.jsというのでできるっぽい
ざっくり説明がありました
[Google API] 手軽にGoogle Maps APIをカスタマイズできる「gmaps.js」の使い方 | ぶぶりんブログ
ここのソースこぴぺでいけるかな、と思ったけど
今現在はAPIキー取得しないと動かないので
まずはAPIキーの取得を
Google Maps の APIキー を簡単に取得する – ねんでぶろぐ
で、APIキー取得したら、コード書いていく
【GoogleMap v3】アイツを消す方法 | Webプログラミング備忘録 | メシのタネ
書いたコードはこんな感じ
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>gmaps.jsサンプル</title>
<style type="text/css">
#map {
width: 800px;
height: 400px;
}
</style>
</head>
<body>
<div id="map"></div>
<script src="//maps.googleapis.com/maps/api/js?key=AIzaSyByzk_T-pIejfEbPOO48d76ZlNdx6MIlGY"></script>
<script src="http://honten.sansui1902.jp/wp-content/themes/baskerville/js/gmaps.js"></script>
<script>
window.onload = function(){
var map = new GMaps({
div: "#map",
lat: 35.658607,
lng: 139.745444,
zoom: 18
});
var styleOptions = [{
featureType: "poi",
elementType: "labels",
stylers: [
{ visibility: "off" }
]}
];
map.setOptions({styles: styleOptions});
map.addMarker({
lat: 35.658607,
lng: 139.745444,
title: 'Marker with InfoWindow',
infoWindow: {
content: '<p>東京たわー</p>'
}
});
};
</script>
</body>
</html>
①まずランドマーク全消しして
②マーカーを設置する
という感じみたい
ほんで、地図の座標ってどうやって見るの?!
という謎がでてきたんですが、これ大したことない話でした
マーカー設置したいとこ右クリックして「この場所について」を選択すると
下からにゅっと情報が出てきます
そこにおもいっきり座標書いてます
URLにも書いてあるけど、ピンポイントならこの座標が正しいはず
という雑な説明でした
どっちかっつーと自分の忘備録的なものやしね・・
整理整頓できない子なのでこういうお役立ちサイトブックマークしまくって
ブックマークが最終的にカオスな感じになってどうにもならんくなるので。