33 comentários

• Tarcísio Araújo(usuário não autenticado)

  3 de Setembro de 2014, 10:28

   

  Pessoal,

   Consegui realizar customização da legenda pegando os elementos via javascript e setando novos atributos. Não sei se é a maneira ideal, mas segue o exemplo:

   

          // Libera a legenda criando uma janela flutuante sobre o mapa
          i3GEO.mapa.legendaHTML.libera2();
          // Ajusta a posição da janela
          moverLegendaTela();

   

         function moverLegendaTela(){
              var moveLegi_c = document.getElementById("moveLegi_c");
             
              if(moveLegi_c){
                  var moveLegi = document.getElementById("moveLegi");
                  var wlegenda = document.getElementById("wlegenda");               
                  var moveLegi_h = document.getElementById("moveLegi_h");
                  var buttonCloseLegenda = document.getElementsByClassName("container-close");
                  buttonCloseLegenda = buttonCloseLegenda[0];
                  var sombraLegenda = document.getElementsByClassName("underlay");               
                  sombraLegenda[0].style.visibility="hidden";
                 
                 
                  moveLegi_c.style.position = "relative";
                  moveLegi_c.style.width = "200px";
                  moveLegi_c.style.cssFloat = "right";
                  moveLegi_c.style.left = "-20px";
                  moveLegi_c.style.top = "-330px";
                  moveLegi_c.style.boxShadow = "1px 1px 8px rgba(0,0,0,0.3)";       
                 
                  moveLegi.style.width = "200px";
                  moveLegi.style.border = "0";
                                 
                  wlegenda.style.width = "181px";
                  wlegenda.style.height = "auto";
                  wlegenda.style.padding =" 0px 0px 5px 20px";
                                 
                  moveLegi_h.className = "";
                  moveLegi_h.style.fontSize  = "15px";
                  moveLegi_h.style.fontWeight  = "bold";
                  moveLegi_h.style.lineHeight  = "34px";
                  moveLegi_h.style.margin  = "0px";
                  moveLegi_h.style.padding  = " 0px 0px 0px 15px";
                  moveLegi_h.style.textAlign = "left";
                  moveLegi_h.style.color = "rgb(255, 255, 255)";
                  moveLegi_h.style.verticalAlign = "baseline";
                  moveLegi_h.style.width = "auto";
                  moveLegi_h.style.height = "35px";
                  moveLegi_h.style.border = "0px none";
                  moveLegi_h.style.backgroundColor = "rgb(49, 126, 191)";
                 
                  buttonCloseLegenda.className = "";
                  buttonCloseLegenda.style.position = "absolute";
                  buttonCloseLegenda.style.align = "right";
                  buttonCloseLegenda.style.float = "right";
                  buttonCloseLegenda.style.fontSize = "16px";
                  buttonCloseLegenda.style.lineHeight = "23px";
                  buttonCloseLegenda.style.backgroundColor = "#63A9E9";
                  buttonCloseLegenda.style.color = "white";
                  buttonCloseLegenda.style.padding = "6px 13px";
                  buttonCloseLegenda.innerHTML = "X";
                  buttonCloseLegenda.style.cursor = "hand";
                  buttonCloseLegenda.style.top = "0";
                  buttonCloseLegenda.style.right = "0";
                  buttonCloseLegenda.style.zIndex = "1";
                 
              }else{
                  var myVar=setTimeout("moverLegendaTela()",1000);
              }
          }

  
  

  • Edmar Moretti(usuário não autenticado)

    3 de Setembro de 2014, 10:46

     

    Eu acho que seria melhor você sobrescrever a função javascript original.

    No seu código javascript, e depois do código original do i3Geo ter sido carregado, basta você copiar a função original e alterá-la, por exemplo, seria algo como:

    i3GEO.mapa.legendaHTML.libera = function(){
    //aqui vai o codigo novo ou o antigo modificado
    };

    O código original fica no arquivo i3geo/classesjs/classe_mapa.js

    
    

    • Tarcísio Araújo(usuário não autenticado)

      3 de Setembro de 2014, 11:29

       

      Obrigado Moretti,

       Vou fazer isso.