2012-07-04 47 views
14

Tôi đang cố gắng tạo bản đồ Google về vị trí công ty của mình. Tôi đã sử dụng nút liên kết trên trang bản đồ của Google. Mọi thứ đều ổn, nhưng khi tôi thu nhỏ bản đồ thành 200 x 200 thì tất cả các điều khiển bản đồ đều chiếm lấy bản đồ và chặn chế độ xem khỏi bản đồ. Có cách nào để có được đi xe của họ? Tất cả những gì tôi muốn là chốt và nút phóng to và thu nhỏ. Cảm ơn bạn.Google maps remove controls

<iframe width="200" height="200" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.com/maps?f=q&amp;source=s_q&amp;hl=en&amp;geocode=&amp;q=244+5th+Avenue,+New+York,+NY&amp;aq=t&amp;sll=37.0625,-95.677068&amp;sspn=48.956293,107.138672&amp;ie=UTF8&amp;hq=&amp;hnear=244+5th+Ave,+New+York,+10016&amp;ll=40.744556,-73.987378&amp;spn=0.005763,0.013078&amp;t=m&amp;z=14&amp;output=embed"></iframe><br /><small><a href="https://maps.google.com/maps?f=q&amp;source=embed&amp;hl=en&amp;geocode=&amp;q=244+5th+Avenue,+New+York,+NY&amp;aq=t&amp;sll=37.0625,-95.677068&amp;sspn=48.956293,107.138672&amp;ie=UTF8&amp;hq=&amp;hnear=244+5th+Ave,+New+York,+10016&amp;ll=40.744556,-73.987378&amp;spn=0.005763,0.013078&amp;t=m&amp;z=14" style="color:#0000FF;text-align:left">View Larger Map</a></small> 
+0

Theo chính Google thì không thể: https://productforums.google.com/forum/#!topic/maps/YTW6zpVIIkQ – bromelio

Trả lời

32

Để tùy chỉnh giao diện, tôi tin rằng bạn cần phải đi sâu vào các API của Google Maps.

Sử dụng API Google Maps, bạn có thể đặt disableDefaultUI thành true.

HTML File:

<!DOCTYPE html> 
<head> 
    <meta charset="utf-8" /> 
    <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script> 
    <script type="text/javascript" src="map.js"></script> 
</head> 
<body> 
    <div id="map" style="width:200px; height:200px;" /> 
</body> 
</html> 

Javascript file:

window.onload = function() { 
    var myOptions = { 
     center: new google.maps.LatLng(40.744556,-73.987378), 
     zoom: 18, 
     mapTypeId: google.maps.MapTypeId.ROADMAP, 
     disableDefaultUI: true 
    }; 

    var map = new google.maps.Map(document.getElementById("map"), myOptions); 
} 
+1

Tôi đã làm việc này một giờ trước và tôi có thể xác nhận đây là cách ẩn giao diện người dùng đầy đủ. +1 –

9

Tôi không tin rằng có thể ẩn điều khiển khi nhúng bản đồ. Bạn sẽ cần phải tạo ra một bản đồ trong javascript bằng cách sử dụng Google Maps API - trong dòng các nội dung sau:

var mapContainer = document.getElementById('mapContainer'); 
var mapOptions = { 
    panControl: false, 
    zoomControl: false, 
    scaleControl: false, 
}; 
var map = new google.maps.Map(mapContainer, mapOptions); 
5

Không có một tham số để ẩn các điều khiển sử dụng IFRAME, nhìn vào liên kết sau để xem các thông số có thể:

http://moz.com/ugc/everything-you-never-wanted-to-know-about-google-maps-parameters

Nếu bạn không muốn sử dụng các API, bạn có thể sử dụng CSS để ẩn các cạnh của bản đồ:

CSS:

.mapaThumb { position:relative; } 
.mapaThumb iframe{ width:200px; height:240px; margin-top:-40px; margin-left:-10px; } 
.mapaThumb .mapaItem{ overflow:hidden; height:150px; } 

HTML:

<div class="mapaThumb"> 
    <div class="mapaItem"> 
     <iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.com.br/maps?f=q&amp;source=s_q&amp;hl=pt-BR&amp;geocode=&amp;q=brazil&amp;aq=&amp;sll=-21.086832,-42.409844&amp;sspn=0.895645,1.674042&amp;ie=UTF8&amp;hq=&amp;hnear=Rep%C3%BAblica+Federativa+do+Brasil&amp;t=m&amp;z=4&amp;ll=-14.235004,-51.92528&amp;output=embed"></iframe> 
    </div> 
</div> 

Đó là không phải là chính xác nhất, nhưng nó hoạt động! Bí quyết cũ được một nhà hiền triết Trung Quốc dạy.

+0

Không hiệu quả với tôi. –

-3

Chỉ cần tạo kiểu bản đồ Google của bạn here, hãy nhấp vào "Tạo mã" và nhúng nó vào <body> của trang web của bạn.

+1

Họ không đề cập đến nó ở bất kỳ đâu trên trang của họ - sử dụng trình tạo này thêm liên kết spam đơn vị liên kết vào trang web của bạn: 'wordpress themes' – Nathron