2012-09-06 31 views
7

Quiero poder especificar efectivamente el radio de puntos en metros. La API está configurada para que la propiedad radius se mantenga constante para los píxeles, por lo que al acercarla se erosiona el mapa de calor (sé que puede hacer que el mapa de calor no se erosione con la propiedad dissipating, pero esto plantea otros problemas, es decir, desordenar manualmente el radio para que mi mapa de calor se muestre correctamente. Aquí están los mapas de calor reference.Radio del mapa de calor de Google Maps, radio del punto de capa

Específicamente, estoy tratando de mostrar una distribución de probabilidad en un mapa. Tengo la distribución en forma de imagen, y quiero asignar los pesos 0-1 a una capa de mapa de calor. (puedo, y no quieren, superponer las imágenes).

¿Alguna sugerencia?

+1

Creo que tendrá que utilizar el hecho de que en cada nivel de zoom, las distancias por pixel doble, a continuación, volver a dibujar un mapa de calor para cada nivel de zoom? –

Respuesta

12

Ok, he intentado algunas cosas:

Uso del Mercator Projection example (check the source) para extraer las coordenadas x, Y del píxel de cualquier punto de una latLng, para su uso posterior del geometry library, specifically the computeOffset function consigue otro latLng un "DM" distancia (en metros) a la derecha de el anterior, obtiene la diferencia (en píxeles) como valor absoluto "DP" y de allí obtienes tu relación "pixelsPerMeter" DP/DM.

Así pues, si desea que su radio sea de 100 metros que acaba de establecer las propiedades de {radius:Math.floor(desiredRadiusPerPointInMeters*pixelsPerMeter)}

y manejar el cambio de zoom sólo tiene que utilizar un oyente

google.maps.event.addListener(map, 'zoom_changed', function() { 
      heatmap.setOptions({radius:getNewRadius()}); 
     }); 

He subido un small example (intente acercar), puede verificar si la distancia se ve bien con el botón en la parte inferior.

+1

Creo que lo tengo casi funcionando, sin embargo, el parámetro TILE_SIZE me está tirando. ¿Por qué está configurado en '256', es esto arbitrario? ¿El mapa, de forma predeterminada, tiene un tamaño de mosaico de (256x256)? ¿Cómo puedo obtener el tamaño de mosaico correcto? – eqzx

+1

gracias. Una cosa a tener en cuenta es que cuando alejas demasiado, cada punto ya no cabe en un píxel y los radios se ponen a cero. al agregar este código en el método 'getNewRadius()', los puntos se representan como no disipadores (imprecisos), pero al menos se procesan ('disipating = false' en init) ' if (totalPixelSize == 0 && dissipating == true) {heatmap.setOptions ({disipating: false}); totalPixelSize =.01; dissipate = false;} else if (totalPixelSize> 0 && dissipate == falso) {heatmap.setOptions ({disipating: true}); dissipate = true;} else if (totalPixelSize == 0) {totalPixelSize = .01;} ' – eqzx

+1

@ nrhine1 El número 256 proviene de' Debido a que el mosaico básico de Mercator Google Maps es de 256 x 256 píxeles, el espacio de coordenadas del mundo utilizable es {0-256}, {0-256} '[en esta página de documentación] (https://developers.google.com/maps/documentation/javascript/maptypes?hl=en#WorldCoordinates), gracias por los comentarios sobre la disipación :) – lccarrasco

1

Para cualquiera que quiera tener una versión de coffeescript muy bien empaquetada del ejemplo jsbin de @lccarrasco, puede ver la esencia del MercatorProjection coffeescript class que creé usando su código.

vez que haya cargado la clase, se puede utilizar con los siguientes:

map = new google.maps.Map(...) 
heatmap = new google.maps.visualization.HeatmapLayer({map: map}) 
google.maps.event.addListener(map, 'zoom_changed',() -> 
    projection = new MercatorProjection() 
    heatmap.setOptions(radius: projection.getNewRadius(map, 15)) 
) 

Donde '15' es el radio en metros que se puede jugar con o establecer mediante programación por otros medios para obtener su mapa de calor para que parezca que lo quieres

+0

Asegúrese de incluir la biblioteca de geometría, es decir: