2011-10-20 42 views
39

Tôi đang sử dụng this explanation cách tô màu điểm đánh dấu bản đồ google bằng cách đặt biểu tượng bằng cách sử dụng MarkerImage và màu hoạt động tốt. Nhưng tôi không thể làm cho đối số scaledSize thay đổi kích thước của điểm đánh dấu.Thay đổi kích thước điểm đánh dấu trong các bản đồ của Google V3

var pinColor = 'FFFF00'; 
    var pinIcon = new google.maps.MarkerImage(
     "http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=%E2%80%A2|" + pinColor, 
     new google.maps.Size(21, 34), 
     new google.maps.Point(0,0), 
     new google.maps.Point(10, 34), 
     new google.maps.Size(2, 4)); 
    marker.setIcon(pinIcon); 

Việc sử dụng đúng đối số scaledSize để thay đổi kích thước điểm đánh dấu là gì? Ví dụ, làm thế nào tôi có thể tăng gấp đôi kích thước điểm đánh dấu?

Trả lời

76

Câu trả lời này giải thích trên John Black's helpful answer, vì vậy tôi sẽ lặp lại một số câu trả lời trong câu trả lời của tôi.

Cách dễ nhất để thay đổi kích thước một dấu hiệu dường như được để lại lập luận 2, 3, và 4 vô việc đo kích thước trong lập luận 5.

var pinIcon = new google.maps.MarkerImage(
    "http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=%E2%80%A2|FFFF00", 
    null, /* size is determined at runtime */ 
    null, /* origin is 0,0 */ 
    null, /* anchor is bottom center of the scaled image */ 
    new google.maps.Size(42, 68) 
); 

Là một sang một bên, this answer cho một câu hỏi tương tự khẳng định rằng việc xác định kích thước điểm đánh dấu trong đối số thứ 2 là tốt hơn so với tỷ lệ trong đối số thứ 5. Tôi không biết điều này có đúng không.

Rời đối số 2-4 rỗng hoạt động tuyệt vời cho hình ảnh pin google mặc định, nhưng bạn phải thiết lập một neo một cách rõ ràng cho hình ảnh pin bóng google mặc định, hoặc nó sẽ giống như thế này:

what happens when you leave anchor null on an enlarged shadow

Trung tâm dưới cùng của hình ảnh pin sẽ được thu thập với đầu ghim khi bạn xem hình ảnh trên bản đồ. Điều này là quan trọng, bởi vì tài sản vị trí của người đánh dấu (vị trí của nhãn hiệu LatLng trên bản đồ) sẽ tự động được thu thập với đầu hình ảnh của ghim khi bạn rời khỏi neo (đối số thứ 4) null. Nói cách khác, để lại neo rỗng đảm bảo các điểm tip, nơi nó được cho là điểm.

Tuy nhiên, đầu của bóng không nằm ở trung tâm dưới cùng. Vì vậy, bạn cần phải đặt đối số thứ 4 một cách rõ ràng để bù đắp đầu của bóng pin để đầu của bóng sẽ được colocated với đầu hình ảnh của pin.

Bằng cách thử nghiệm, tôi tìm thấy đầu của bóng sẽ được đặt như sau: x bằng 1/3 kích thước và y là 100% kích thước.

var pinShadow = new google.maps.MarkerImage(
    "http://chart.apis.google.com/chart?chst=d_map_pin_shadow", 
    null, 
    null, 
    /* Offset x axis 33% of overall size, Offset y axis 100% of overall size */ 
    new google.maps.Point(40, 110), 
    new google.maps.Size(120, 110)); 

để cung cấp cho này:

offset the enlarged shadow anchor explicitly

+4

Có cách nào để giữ nguyên tỷ lệ khía cạnh trong 'google.maps.Size', hoặc để xác định tỷ lệ phần trăm thay vì pixel thực tế? Cảm ơn! –

+0

Có cách nào để quy mô lại biểu tượng điểm đánh dấu mặc định không? Tức là, tôi có thể thay đổi tỷ lệ của điểm đánh dấu _without_ phải sử dụng 'setIcon' trên điểm đánh dấu không? – ironchicken

21

Đối số kích thước bằng pixel. Vì vậy, để tăng gấp đôi kích thước marker của ví dụ của bạn đối số thứ năm để các nhà xây dựng MarkerImage sẽ là:

new google.maps.Size(42,68) 

Tôi tìm thấy nó dễ dàng nhất để cho các con số bản đồ API ra những lập luận khác, trừ khi tôi cần một cái gì đó khác hơn đáy/center của hình ảnh dưới dạng neo. Trong trường hợp của bạn, bạn có thể thực hiện:

var pinIcon = new google.maps.MarkerImage(
    "http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=%E2%80%A2|" + pinColor, 
    null, /* size is determined at runtime */ 
    null, /* origin is 0,0 */ 
    null, /* anchor is bottom center of the scaled image */ 
    new google.maps.Size(42, 68) 
); 
Các vấn đề liên quan