PC Toledo

Em homenagem a Paulo Cesar Toledo
https://pctoledo.org/

graficos por html - javascript

https://pctoledo.org/viewtopic.php?t=15384

Página 1 de 1

graficos por html - javascript

Enviado: 26 Ago 2014 20:00
por Abel
ola, estou tentando gerar graficos pelo meu sistema em harbour.
atraves do google, montei um html e ate ai funciona perfeitamente.

ele abre o navegador padrao e gera o grafico, o problema é que eu gostaria que nestes casos a barra de endereco do navegador ficasse oculta, mas como nao conheço nada de javascript ficou dificil. segue meu exemplo de html

se alguem puder me ajudar, desde ja agradeço.
Abel

Código: Selecionar todos

<html> 
  <head>
          <script type="text/javascript" src="https://www.google.com/jsapi">  </script>
           <script type="text/javascript">
           google.load("visualization", "1", {packages:["corechart"]}); 
           google.setOnLoadCallback(drawChart); 
           function drawChart() { 
              var data = google.visualization.arrayToDataTable([ 
                  ['Tipo', 'Quantidade'],
['KAUANE -   22',   22],
['ANDRESSA -   29',   29],
                ]); 
        var options = { 
            title: ' Matriculas - 01/02/2014 a 28/02/2014 ', is3D: true, 
          }; 
        var chart = new google.visualization.PieChart(document.getElementById('piechart_3d')); 
        chart.draw(data, options); 
        } 
     </script> 
   </head> 
   <body> 
       <div id="piechart_3d" style="width: 900px; height: 500px;"></div> 
   </body> 
</html>

graficos por html - javascript

Enviado: 01 Set 2014 11:51
por rochinha
Amiguinho,

Voce ta usando modo console? A melhor forma é acionar o .HTML gerado via script .HTA.

Código: Selecionar todos

<html>
   <head>
      <title>5Volution Suporte</title>
      <HTA:APPLICATION ID="oHTA" BORDER="dialog" CAPTION="yes" MAXIMIZEBUTTON="no" MINIMIZEBUTTON="no" NAVIGABLE="yes" CONTEXTMENU="no" INNERBORDER="no" SCROLL="yes"/>
      <script language="javascript">window.resizeTo(240,340); window.moveTo((window.screen.availWidth-240)/2, (window.screen.availHeight-340)/2);</script>
   </head>
   <frameset rows="*">
      <frame scrolling="yes" src="SeuGrafico.htm">
   </frameset>
</html>
Outra forma é acionar o iexplore através de OLE, onde ao passar parametros voce define que menus e outras coisas não aparecam na tela.

Código: Selecionar todos

   oIE:=TOleAuto():New( "InternetExplorer.Application" )
   oIE:Visible   := .T.
   oIE:ToolBar   := .F. // Sem toolbar
   oIE:StatusBar := .F. // Sem barra de status
   oIE:Top       := 055
   oIE:Left      := 001
   oIE:Height    := 600
   oIE:Width     := 800
   oIE:MenuBar   := .F. // Sem menus
   oIE:Navigate( cEndereco )
   if lPrint // Se quiser que a saida va para impressora.
      oIE:ExecWB(6,0,0,0) // Imprimir
   endif
   oIE:End()
Para usar OLE voce deve saber qual a versão de Harbour que voce usa e qual a biblioteca com este suporte que deva ser agregada na compilação.

graficos por html - javascript

Enviado: 03 Set 2014 20:46
por Abel
Ola Rochinha,
usei sua ideia e executei meu htm via script .HTA do jeito que vc enviou o exemplo.

Apareceu na barra de endereço do navegador a pasta onde o arquivo htm foi executado.

exemplo:
file:///D:/SISTEMAS/PROGRAMA/G1.HTML

G1.HTML É O SEU SCRIPT.
não dá para inibir a linha de endereço do navegador ?

Abraços
ABEL

graficos por html - javascript

Enviado: 04 Set 2014 01:30
por rochinha
Amiguinho,

Qual seu navegador padrão e qual versão do seu S.O.? Talvez o .HTA para funcionar como um popup só possa ser executado pelo IE.

Veja nas linhas abaixo as alterações que voce deverá fazer.

Código: Selecionar todos

   <head>
      <title>5Volution Suporte</title>
      <HTA:APPLICATION ID="oHTA" ICON="http://www.5volution.com/favicon.ico" BORDER="dialog" CAPTION="yes" LOCATION="no" MAXIMIZEBUTTON="no" MINIMIZEBUTTON="no" NAVIGABLE="yes" CONTEXTMENU="no" INNERBORDER="no" SCROLL="yes"/>
      <script language="javascript">window.resizeTo(600,400); window.moveTo((window.screen.availWidth-240)/2, (window.screen.availHeight-340)/2);window.menubar="no";window.toolbar="no";window.statusbar="no"</script>
   </head>

graficos por html - javascript

Enviado: 06 Set 2014 17:11
por Abel
Rochinha, meu navegador padrao é o chrome, e tambem utilizo o firefox.
o IE é muito lento, meus clientes tambem tem preferencia pelo chrome.
fiz a alteração mas nao deu certo, segue o html que gera o gráfico.
descobri outro problema, o botao fechar nao funciona no meu firefox.

sistema operacional windows 7

Código: Selecionar todos


<html> 
  <head> 
         Grafico de Barras    <script type="text/javascript" src="https://www.google.com/jsapi"></script> 
      <script type="text/javascript"> 
           google.load("visualization", "1", {packages:["corechart"]}); 
           google.setOnLoadCallback(drawChart); 
           function drawChart() { 
              var data = google.visualization.arrayToDataTable([ 
                  ['Nomes', 'X1',{role:'annotation'},'X2',{role:'annotation'}],
['EDUARDO          ',   16,'   16' ,   11,'   11'],
['AVELINO          ',    1,'    1' ,    1,'    1']
['SERGIO           ',    1,'    1' ,    0,'    0'],
['VANIA            ',   10,'   10' ,    5,'    5'],
['MAURINA          ',    6,'    6' ,    1,'    1'],
['RESERVA CARRO    ',    1,'    1' ,    0,'    0'],
['THIAGO ALVES     ',   13,'   13' ,    5,'    5'],
['CARLOS           ',    7,'    7' ,    1,'    1'],
                ]); 
        var options = { 
            title: ' Exames - 01/01/2014 a 30/06/2014 ',
            vAxis: {title: 'Nomes ', titleTextStyle: {color: 'red'}}
          }; 
        var chart = new google.visualization.BarChart(document.getElementById('chart_div')); 
        chart.draw(data, options); 
        } 
     </script> 
   </head> 
   <body> 
       <div id="chart_div" style="width: 950px; height: 600px;"></div> 
       <form>  
           <input type="button" value="Clique para imprimir " OnClick="javascript:window.print()"> 
       </form> 
       <input type=button value="Fechar  " onClick="javascript:window.close();"> 
   </body> 
</html>

Abraços,
ABEL

graficos por html - javascript

Enviado: 12 Set 2014 02:53
por rochinha
Amiguinho,

Fiz um teste com o html de seu último post, mas no meu Chrome nem aparece nada. Montei os .HTAs abaixo e seus respectivos .HTMLs para ver o resultado da janela.

Os popups abertos não apresentam barra alguma, seja de endereço ou status. Voce precisa ver quais os browsers estão instalados e qual deles é chamada por padrão.

grafico.hta

Código: Selecionar todos

<html>
   <head>
      <title>5Volution Suporte</title>
      <HTA:APPLICATION ID="oHTA" ICON="http://www.5volution.com/favicon.ico" BORDER="dialog" CAPTION="yes" LOCATION="no" MAXIMIZEBUTTON="no" MINIMIZEBUTTON="no" NAVIGABLE="yes" CONTEXTMENU="no" INNERBORDER="no" SCROLL="yes"/>
      <script language="javascript">window.resizeTo(600,400); window.moveTo((window.screen.availWidth-240)/2, (window.screen.availHeight-340)/2);
window.menubar="no";window.toolbar="no";window.statusbar="no";window.location=""</script>
   </head>
   <frameset rows="*">
      <frame scrolling="yes" src="grafico.htm">
   </frameset>
</html>
grafico.htm

Código: Selecionar todos

<html>
  <head>
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">
      google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);
      function drawChart() {

        var data = google.visualization.arrayToDataTable([
          ['Task', 'Hours per Day'],
          ['Work',     11],
          ['Eat',      2],
          ['Commute',  2],
          ['Watch TV', 2],
          ['Sleep',    7]
        ]);

        var options = {
          title: 'My Daily Activities'
        };

        var chart = new google.visualization.PieChart(document.getElementById('piechart'));

        chart.draw(data, options);
      }
    </script>
  </head>
  <body>
    <div id="piechart" style="width: 900px; height: 500px;"></div>
  </body>
</html>
geomap.hta

Código: Selecionar todos

<html>
   <head>
      <title>5Volution Suporte</title>
      <HTA:APPLICATION ID="oHTA" ICON="http://www.5volution.com/favicon.ico" BORDER="dialog" CAPTION="yes" LOCATION="no" MAXIMIZEBUTTON="no" MINIMIZEBUTTON="no" NAVIGABLE="yes" CONTEXTMENU="no" INNERBORDER="no" SCROLL="yes"/>
      <script language="javascript">window.resizeTo(600,400); window.moveTo((window.screen.availWidth-240)/2, (window.screen.availHeight-340)/2);
window.menubar="no";window.toolbar="no";window.statusbar="no";window.location=""</script>
   </head>
   <frameset rows="*">
      <frame scrolling="yes" src="geomap.htm">
   </frameset>
</html>
geomap.htm

Código: Selecionar todos

<html>
  <head>
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">
      google.load("visualization", "1", {packages:["geomap"]});
      google.setOnLoadCallback(drawMap);

      function drawMap() {
        var data = google.visualization.arrayToDataTable([
          ['Country', 'Popularity'],
          ['Germany', 200],
          ['United States', 300],
          ['Brazil', 400],
          ['Canada', 500],
          ['France', 600],
          ['RU', 700]
        ]);

        var options = {};
        options['dataMode'] = 'regions';

        var container = document.getElementById('regions_div');
        var geomap = new google.visualization.GeoMap(container);

        geomap.draw(data, options);
      };
    </script>
  </head>
  <body>
    <div id="regions_div" style="width: 900px; height: 500px;"></div>
  </body>
</html>

graficos por html - javascript

Enviado: 19 Set 2014 20:02
por Abel
Valeu Rochinha,
agora que eu entendi, como montar o hta e chamar o htm,

tem alguma forma de eu mandar abrir sempre em tela cheia ?

em janela esta normal.
desde ja agradeço,

ABRAÇOS,
ABEL

graficos por html - javascript

Enviado: 02 Out 2014 02:17
por rochinha
Amiguinho,

Os parâmetros para configuração de um script HTA estão abaixo:

Código: Selecionar todos

<HTA:APPLICATION 
border="thin" 
borderStyle="normal" 
caption="yes" 
icon="http://www.htmlgoodies.com/favicon.ico" 
maximizeButton="yes" 
minimizeButton="yes" 
showInTaskbar="no" 
windowState="maximize"
innerBorder="yes"
navigable="yes"
scroll="auto"
scrollFlat="yes" />
Eu sugiro que voce desista de gerar gráficos usando a API do Google.
Nossa, Rochinha, voce sempre foi incentivador de uso de várias ferramentas...
Explico:

A API do Google trabalha de forma online, se o seu aplicativo leva em consideração o uso desta API deve prever a sua falta, quando a falta de conecção atrapalhar a visualização dos gráficos.

Aposte em alguma coisa mais real, off-line e livre de contratempos.

Vasculhando meus arquivos encontrei este conjunto que pode servir para voce. Trabalha off-line, usa HTML e Javascript.

Voce deverá aprender como usar tabelas em JSON, pois são diferentes das tabelas que conhecemos com linhas e colunas, mas os exemplos são fáceis de entender.

Baixe o FLOT, descompacte em uma pasta qualquer, entre nesta pasta e execute o INDEX.HTML. Navegue pelos links e veja os exemplos, depois vasculhe os arquivos JSON.

graficos por html - javascript

Enviado: 14 Nov 2014 21:19
por rochinha
Amiguinhos,

Solução Simples
Todos os horários são UTC-03:00
Página 1 de 1

Powered by phpBB® Forum Software © phpBB Limited

Traduzido por: Suporte phpBB