Gere blocos para sobreposições do Google Maps

Estou tentando mostrar algumas informações no Google Maps que seriam na forma de sobreposições de círculos translúcidos. O problema é que alguns círculos se sobrepõem, o que resulta em maior opacidade e mistura de cores se os círculos tiverem cores diferentes. Pesquisei bastante e cheguei à conclusão de que não há como evitar a mistura de cores.

A solução alternativa que me foi recomendada foi gerar blocos png no meu servidor e exibi-los ou decidir a cor de cada pixel no lado do servidor e usar a tela HTML5 e renderizar cada pixel. Pesquisei bastante, mas não consegui encontrar nenhuma maneira de fazê-lo. Seria muito útil se alguém pudesse me apontar na direção certa.

Estou reformulando minha pergunta abaixo para ser mais clara e concisa

Eu tenho que exibir círculos em um mapa. O raio e a cor desses círculos representam sua área de influência e tipo de influência. Esses círculos são translúcidos, mas a sobreposição deve resultar apenas na visível da parte superior, sem mistura. Como eu gero blocos para esta informação?

Provavelmente não estou claro, por isso estou adicionando mais detalhes.

Verifique este jsFiddle http://jsfiddle.net/Dv4UT/ . Existem dois círculos sobrepostos: verde (zIndex: 10) e vermelho (zIndex: 11) com opacidade .5 .A parte sobreposta é uma mistura de vermelho e verde enquanto eu quero a parte sobreposta deve ter a cor superior com a mesma opacidade, por exemplo: vermelho. Se isso for possível usando sobreposições de mapa, seria ótimo. Por fim, eu teria que recorrer à geração de blocos no lado do servidor e usá-los como sobreposições. Não tenho idéia de gerar blocos e seria muito útil se alguém pudesse me apontar na direção certa. captura de tela do mapa de trulia commute, verifique se os círculos abaixo estão sendo substituídos pelos de cima. Preciso de um tipo de visualização semelhante.

crie sua sobreposição offline (mas dinamicamente) usando a linguagem de programação de sua escolha. será um pouco complexo, mas o pseudo-código básico seria:

browser javascript send request url for overlay
acquire gis bounds for tile server side
gather all points and sort by their relevance
create image(transparent)
for each point: (least relevant first)
   draw new circle (will 'overwrite' any overlap areas)
stream image to browser
display image as overlay

dependendo do tamanho da sua área, você pode criar uma varredura offline e depois servi-la com o servidor de mapas ou outro programa de entrega de mapeamento gratuito. criar sua própria varredura garantirá que a exibição seja como você deseja.

Eu faria o seguinte:

1. Mantenha a opacidade dos círculos muito baixa (para que o problema de mistura não se torne mainstream)
2. Ao passar o mouse, altere a opacidade para superar a do círculo que se cruza

Dessa forma, eu seria capaz de exibir dados sem nenhuma interferência induzida pela mistura de cores e realçar um círculo específico à medida que o usuário passasse o mouse sobre ele.