/* Title: Desenho de elementos gráficos i3GEO.desenho Controla as operações de desenho sobre o mapa Por desenho, entende-se elementos que são incluídos graficamente no mapa, como por exemplo, linhas, pontos, círculos, etc e que não compõem layers com dados As operações de desenho são baseadas na biblioteca Richdraw (i3geo/pacotes/richdraw) Link: http://starkravingfinkle.org/blog/2006/04/richdraw-simple-vmlsvg-editor/ Arquivo: i3geo/classesjs/classe_desenho.js Licença: GPL2 i3Geo Interface Integrada de Ferramentas de Geoprocessamento para Internet Direitos Autorais Reservados (c) 2006 Ministério do Meio Ambiente Brasil Desenvolvedor: Edmar Moretti edmar.moretti@gmail.com Este programa é software livre; você pode redistribuí-lo e/ou modificá-lo sob os termos da Licença Pública Geral GNU conforme publicada pela Free Software Foundation; Este programa é distribuído na expectativa de que seja útil, porém, SEM NENHUMA GARANTIA; nem mesmo a garantia implícita de COMERCIABILIDADE OU ADEQUACÃO A UMA FINALIDADE ESPECÍFICA. Consulte a Licença Pública Geral do GNU para mais detalhes. Você deve ter recebido uma cópia da Licença Pública Geral do GNU junto com este programa; se não, escreva para a Free Software Foundation, Inc., no endereço 59 Temple Street, Suite 330, Boston, MA 02111-1307 USA. */ if(typeof(i3GEO) === 'undefined'){ var i3GEO = {}; } i3GEO.desenho = { /* Variavel: richdraw Objeto richdraw criado por criaContainerRichdraw Tipo: {richdraw object} */ richdraw: "", /* Propriedade: estilos Estilos que podem ser utilizados para desenhar os elementos */ estilos: { "normal":{ fillcolor: 'red', linecolor: 'black', linewidth: '1', circcolor: 'white', textcolor: 'gray' }, "palido":{ fillcolor: 'gray', linecolor: 'gray', linewidth: '1', circcolor: 'gray', textcolor: 'gray' }, "vermelho":{ fillcolor: 'gray', linecolor: 'red', linewidth: '1', circcolor: 'pink', textcolor: 'brown' }, "verde":{ fillcolor: 'gray', linecolor: 'green', linewidth: '1', circcolor: 'DarkGreen', textcolor: 'GreenYellow' } }, /* Propriedade: estiloPadrao Estilo utilizado como padrão */ estiloPadrao: "normal", /* Cria os elementos 'dom' necessários ao uso das funções de desenho sobre o mapa. As ferramentas de cálculo de distâncias e áreas utilizam esse container. Richdraw é uma biblioteca utilizada pelo i3geo para abstrair as diferenças entre as linguagens svg e vml. Essa abstração é necessária devido às diferenças entre os navegadores. O container é criado dentro de um DIV chamado "divGeometriasTemp" Essa função cria também o objeto pontosdistobj que é utilizado para armazenar os dados obtidos da movimentação do mouse sobre o mapa */ criaContainerRichdraw: function(){ if(typeof(console) !== 'undefined'){console.info("i3GEO.desenho.criaContainerRichdraw()");} pontosdistobj = { xpt: [], ypt: [], dist: [], distV: [], xtela: [], ytela: [], ximg: [], yimg: [], linhas: [] }; if(i3GEO.Interface.ATUAL === "googleearth") {return;} try{ var divgeo,renderer; divgeo = i3GEO.desenho.criaDivContainer(); divgeo.innerHTML = ""; // //cria o objeto renderer conforme o browser em uso //esse objeto será utilizado nas funções de desenho //mais detalhes, veja em pacotes/richdraw //Conforme a resposta do navegador, utiliza-se a criação VML ou SVG // try{ renderer = new VMLRenderer(); i3GEO.desenho.richdraw = new RichDrawEditor(divgeo, renderer); } catch(erro){ renderer = new SVGRenderer(); i3GEO.desenho.richdraw = new RichDrawEditor(divgeo, renderer); renderer.svgRoot.style.width = divgeo.style.width; renderer.svgRoot.style.height = divgeo.style.height; } // //definição dos símbolos default para os elementos gráficos // i3GEO.desenho.definePadrao(i3GEO.desenho.estiloPadrao); i3GEO.desenho.richdraw.editCommand('mode', 'line'); divgeo.style.display="block"; // //após o container ser criado, é necessário que as funções //de clique sobre o mapa sejam ativadas //para funcionarem sobre o container // i3GEO.eventos.ativa(divgeo); if($i("localizarxygeoProjxg")){ var temp = function(){ i3GEO.coordenadas.atualizaGeo(objposicaocursor.dmsx,objposicaocursor.dmsy,"localizarxygeoProj"); }; YAHOO.util.Event.addListener(divgeo,"mousemove", temp); } } catch(men){alert("Erro ao tentar criar container richdraw "+men);} }, /* Cria o elemento DIV que será utilizado para renderizar os elementos gráficos. Nesse DIV serão incluídos os elementos de desenho em SVG ou VML O DIV recebe como ID "divGeometriasTemp" Return: DOM object */ criaDivContainer: function(){ desenhoUltimaLinha = ""; desenhoUltimaLinhaPol = ""; if (!$i("divGeometriasTemp")){ var pos,novoel,ne; // //pega a posição da imagem do mapa para posicionar corretamente o container // pos = [0,0]; pos = i3GEO.util.pegaPosicaoObjeto($i(i3GEO.Interface.IDCORPO)); // //cria o container // novoel = document.createElement("div"); novoel.id = "divGeometriasTemp"; ne = novoel.style; ne.cursor="crosshair"; ne.zIndex=0; if(i3GEO.Interface.TABLET === true) {ne.zIndex=5000;} ne.position="absolute"; ne.width=i3GEO.parametros.w + "px"; ne.height=i3GEO.parametros.h + "px"; ne.border="0px solid black"; ne.display="none"; ne.top=pos[1] + "px"; ne.left=pos[0] + "px"; document.body.appendChild(novoel); } return ($i("divGeometriasTemp")); }, /* Desenha ou reposiciona elementos na tela usando a biblioteca richdraw Parametros: tipo {string} - resizelinha|resizePoligono|insereCirculo tipo de operação objeto {object} - objeto gráfico existente no container richdraw n {numeric} - índice do elemento no array pontosdistobj texto {string} - texto que será inserido no tipo "insereTexto" */ aplica: function(tipo,objeto,n,texto){ var dy,dx,w,c; if(i3GEO.desenho.richdraw && $i(i3GEO.Interface.IDCORPO)){ //pos = i3GEO.util.pegaPosicaoObjeto($i(i3GEO.Interface.IDCORPO)); // //faz o reposicionamento de linhas quando o mouse é movido e a linha está ativa // if((tipo==="resizeLinha") || (tipo==="resizePoligono")){ try {i3GEO.desenho.richdraw.renderer.resize(objeto,0,0,objposicaocursor.imgx,objposicaocursor.imgy);} catch(erro){ if(typeof(console) !== 'undefined'){console.error("i3GEO.desenho "+erro);} } } if(tipo==="insereCirculo"){ dx = Math.pow(((pontosdistobj.xtela[n])*1) - ((pontosdistobj.xtela[n-1])*1),2); dy = Math.pow(((pontosdistobj.ytela[n])*1) - ((pontosdistobj.ytela[n-1])*1),2); w = Math.sqrt(dx + dy); c = 'rgba(255,255,255,0)'; if(chro){ c = ""; } i3GEO.desenho.insereCirculo(pontosdistobj.ximg[n-1],pontosdistobj.yimg[n-1],w,c); } if(tipo==="insereTexto"){ try{ i3GEO.desenho.richdraw.renderer.create('text', '', i3GEO.desenho.richdraw.textColor, 1, pontosdistobj.ximg[n-1],pontosdistobj.yimg[n-1],"","",texto); } catch(men){ if(typeof(console) !== 'undefined'){console.error("i3GEO.desenho "+men);} } } } }, /* Insere um circulo no container de elementos gráficos Parametros: x {numerico} - posição do ponto em coordenadas de imagem y {numerico} - posição do ponto em coordenadas de imagem w {numerico} - raio do círculo em pixels b {string} - cor do fundo */ insereCirculo: function(x,y,w,b){ if(!b){ b = ""; } try{ i3GEO.desenho.richdraw.renderer.create('circ', b, i3GEO.desenho.richdraw.circColor, i3GEO.desenho.richdraw.lineWidth, x,y,w,w); } catch(men){ if(typeof(console) !== 'undefined'){console.error(men);} } }, /* Aplica um determinado padrao de estilos para os novos elementos que serão adicionados Parametro: padrao {string} - nome do estilo */ definePadrao: function(padrao){ padrao = i3GEO.desenho.estilos[padrao]; i3GEO.desenho.richdraw.editCommand('fillcolor', padrao.fillcolor); i3GEO.desenho.richdraw.editCommand('linecolor', padrao.linecolor); i3GEO.desenho.richdraw.editCommand('linewidth', padrao.linewidth); i3GEO.desenho.richdraw.editCommand('circcolor', padrao.circcolor); i3GEO.desenho.richdraw.editCommand('textcolor', padrao.textcolor); }, /* Cria uma caixa de seleção para escolha do estilo a ser utilizado */ caixaEstilos: function(){ var lista = i3GEO.util.listaChaves(i3GEO.desenho.estilos), n = lista.length, i, caixa, sel; caixa = ""; return caixa; } }; //YAHOO.log("carregou classe desenho", "Classes i3geo");