Google Maps Staticにカスタムテキストを追加しますか？

Question

Google静的地図にカスタムテキストを追加することはできますか？私は、次のように静的グーグルを使用しています

：

https://maps.googleapis.com/maps/api/staticmap?&zoom=7&text=testcenter=51.45400691005982,-4.4439697265625&size=600x600&maptype=roadmap&key=key&path=xxx,yyy 

Answer 1

[OK]をので、ここでの事である、Googleマップの静的は、基本的に画像を使用してDOMに移入されます。あなたはこの画像の特性を変更することができますが、それはGoogleから来て、あなたのDOMで修正することはできません。テキストをオーバーレイするには、テキストを配置する別のdiv内にマップdivを埋め込む必要があります。

基本的には次のようになります。

<div class="wrapper"> 

    <div id="googleMap"> 
     <img src="https://maps.googleapis.com/maps/api/staticmap?center=Berkeley,CA&zoom=14&size=400x400"> 
    </div> 

    <div id="mapText"> 
     <span>THIS IS YOUR TEXT</span> 
    </div> 

</div> 

を次にあなたがこのテキストは、地図上にオーバーレイ表示させたい正確にどのように、どこでスタイルをCSSを使用することができます。

.wrapper { 
    position: relative; 
} 

#mapText { 
    position: absolute; 
    bottom: 50%; 
    font-family: sans-serif; 
    font-size: 30px; 
    color: red; 
} 

フィドルでこれをテストし、正常に動作します。これが助けて欲しい！