OT: API Google crear gráficas

HMG en Español

Moderator: Rathinagiri

User avatar
tonton2
Posts: 291
Joined: Sat Jun 29, 2013 1:26 pm
Location: Algerie
Has thanked: 7 times
Been thanked: 11 times
Contact:

Re: OT: API Google crear gráficas

Post by tonton2 » Tue Nov 27, 2018 9:44 am

Voila ce que me donne le graphisme de Votre 1er exemple avec une base de données
traduction google
This is what gives me the graphics with your first sample with a database table
BLPRODUIT.rar
(35.68 KiB) Downloaded 52 times
L'Algerie vous salut
Y.TABET

edk
Posts: 481
Joined: Thu Oct 16, 2014 11:35 am
Location: Poland
Has thanked: 136 times
Been thanked: 388 times

Post by edk » Tue Nov 27, 2018 10:08 am

tonton2 wrote:
Tue Nov 27, 2018 9:44 am
This is what gives me the graphics with your first sample with a database tableBLPRODUIT.rar
You can customize the chart according to the Google Chart documentation (https://developers.google.com/chart/ima ... ta_formats), respectively by sending a GET or POST query.
Last edited by edk on Tue Nov 27, 2018 12:38 pm, edited 1 time in total.

edk
Posts: 481
Joined: Thu Oct 16, 2014 11:35 am
Location: Poland
Has thanked: 136 times
Been thanked: 388 times

Post by edk » Tue Nov 27, 2018 10:55 am

andyglezl wrote:
Mon Nov 26, 2018 8:39 pm
Hola
Desde WIN7 el IExplorer los bloquea automaticamente.
Usar controles ActiveX en Internet Explorer 10 e Internet Explorer 11
Se aplica: Windows Internet Explorer, Windows10, Windows 8.1, Windows 7.

Controles ActiveX
Los controles ActiveX son pequeñas aplicaciones que permiten a los sitios web proporcionar contenido, como vídeos y juegos. También te permiten interactuar con contenido como barras de herramientas y tableros de cotizaciones mientras navegas por Internet. A veces, estas aplicaciones pueden producir errores o proporcionar contenido no deseado. En algunos casos, estas aplicaciones pueden usarse para recopilar información de tu PC o pueden dañar tu información, instalar software sin tu consentimiento o permitir que otra persona controle el equipo de forma remota.

Filtrado ActiveX
El filtrado ActiveX de Internet Explorer impide que los sitios instalen y usen estas aplicaciones. Esto puede ayudar a mantener la seguridad durante la navegación, pero también puede afectar al rendimiento de determinados sitios. Por ejemplo, si el filtrado ActiveX está activado, es posible que algunos vídeos, juegos u otro contenido interactivo no funcionen.
*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
Hello
From WIN7 the IExplorer automatically locks them.
Use ActiveX controls in Internet Explorer 10 and Internet Explorer 11
Applies: Windows Internet Explorer, Windows10, Windows 8.1, Windows 7.
 
ActiveX controls
ActiveX controls are small applications that allow websites to provide content, such as videos and games. They also allow you to interact with content such as toolbars and quote boards while you browse the Internet. Sometimes, these applications can cause errors or provide unwanted content. In some cases, these applications can be used to gather information from your PC or they can damage your information, install software without your consent or allow another person to control the computer remotely.

ActiveX filtering
Internet Explorer ActiveX filtering prevents sites from installing and using these applications. This can help maintain security during navigation, but it can also affect the performance of certain sites. For example, if ActiveX filtering is enabled, some videos, games or other interactive content may not work.
This version works with WebBrowse with a specified version of IE (tested on Win 10 64 bit). Just added this meta tag: <meta http-equiv="X-UA-Compatible" content="IE=edge" /> 😁
Greetings goes to: https://weblog.west-wind.com/posts/2011 ... ie-version 👍
Works also with:
<meta http-equiv="X-UA-Compatible" content="IE=9" />
<meta http-equiv="X-UA-Compatible" content="IE=10" />
<meta http-equiv="X-UA-Compatible" content="IE=11" /> 😏

Code: Select all

/*
https://developers.google.com/chart/
*/

#include "hmg.ch"

Function Main()

Local aRows[6], aCombo:={}

aRows [1]	:= {'Simpson',5}
aRows [2]	:= {'Mulder',30} 
aRows [3]	:= {'Smart',50} 
aRows [4]	:= {'Grillo',120} 
aRows [5]	:= {'Kirk',90} 
aRows [6]	:= {'Barriga',200}

PRIVATE aTypes [5]
aTypes [1] := {"Pie","PieChart"}
aTypes [2] := {"Pie 3D", "PieChart3D"}
aTypes [3] := {"Line", "LineChart"}
aTypes [4] := {"Bar", "BarChart"}
aTypes [5] := {"Column", "ColumnChart"}

AEVAL(aTypes, { |x| AADD( aCombo, x[1]) } )

DEFINE WINDOW Win_1 AT 192 , 422 WIDTH 600 HEIGHT 500 TITLE "Google Chart Html Sample" MAIN

	@ 20,20 GRID Grid_1 ;
		WIDTH 300 ;
		HEIGHT 110 ;
		HEADERS {'Label','Data'} ;
		WIDTHS {100,100};
		ITEMS aRows ;
		VALUE {1,1} ;
		EDIT ;
		CELLNAVIGATION 

	@ 20, 390 COMBOBOX Combo_1 ;
		WIDTH  135 ;
		HEIGHT 94 ;
		ITEMS aCombo ;  
		VALUE 1

	@ 60,390 TEXTBOX t_Width ;
		WIDTH 50 ;
		VALUE 480 ;
		NUMERIC INPUTMASK "999" 

	@ 100,390 TEXTBOX t_Height ;
		WIDTH 50 ;
		VALUE 250 ;
		NUMERIC INPUTMASK "999" 

	@ 20,340 LABEL Label_1 ;
		WIDTH 50 HEIGHT 20 ;
		VALUE 'Type'

	@ 60,340 LABEL Label_2 ;
		WIDTH 50 HEIGHT 20 ;
		VALUE 'Width'
    
	@ 100,340 LABEL Label_3 ;
		WIDTH 50 HEIGHT 20 ;
		VALUE 'Height'

	@ 100, 460 BUTTON Button_1 ;
		CAPTION "Generate" ;
		ACTION GoogleChartApi_() ;
		WIDTH  70 HEIGHT 28 


    DEFINE ACTIVEX Activex_1
        ROW    150
        COL    20
        WIDTH  540
        HEIGHT 200
        PROGID "shell.explorer.2"
    END ACTIVEX

END WINDOW

HMG_ChangeWindowStyle(GetControlHandle("Activex_1","Win_1"), WS_EX_CLIENTEDGE, NIL, .T.)
oActiveX:= GetProperty('Win_1','Activex_1','Object')
oActiveX:Silent := 1

END WINDOW

CENTER WINDOW Win_1

ACTIVATE WINDOW Win_1

Return Nil

****************************************************************************************
Function GoogleChartApi_()

Local cApiUrl := "https://chart.googleapis.com/chart"
Local cPOSTdata := ""
LOCAL oGoogle, cGoogleResp
Local cChartType := aTypes [Win_1.Combo_1.Value] [2]
Local cChartWidth := Alltrim(STR( Win_1.t_Width.Value ) )
Local cChartHeight := Alltrim(STR( Win_1.t_Height.Value ) )
Local i, cChartData := "", cChartLabel := ""
Local cHeaders := "User-Agent: Mozilla/5.0 (compatible; MSIE 9.0; Windows Phone OS 7.5; Trident/5.0; IEMobile/9.0)"
Local cHtmlFile := "GoogleChart.html"
Local cLocalUrl := "file:///" + GetCurrentFolder() + "/" + cHtmlFile
Local cHtmlString := "" 		//"<!-- saved from url=(0017)" + "http://localhost/" /* cLocalUrl */ + " -->" + CRLF

cHtmlString += '<html>  <head> <meta http-equiv="X-UA-Compatible" content="IE=edge" />  <meta charset="utf-8">' + CRLF + '<!--Load the AJAX API-->'  + CRLF
cHtmlString += '<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>' + CRLF
cHtmlString += '<script type="text/javascript">' + CRLF 
cHtmlString += '// Load the Visualization API and the corechart package.' + CRLF
cHtmlString += "google.charts.load('current', {'packages':['corechart']});" + CRLF
cHtmlString += '// Set a callback to run when the Google Visualization API is loaded.' + CRLF
cHtmlString += 'google.charts.setOnLoadCallback(drawChart);' + CRLF
cHtmlString += '// Callback that creates and populates a data table, instantiates the pie chart, passes in the data and draws it.' + CRLF
cHtmlString += 'function drawChart() {' + CRLF
cHtmlString += '// Create the data table.' + CRLF
cHtmlString += 'var data = new google.visualization.DataTable();' + CRLF
cHtmlString += "data.addColumn('string', 'Topping');" + CRLF
cHtmlString += "data.addColumn('number', 'Slices');" + CRLF
cHtmlString += "data.addRows([" +CRLF

FOR i=1 TO Win_1.Grid_1.ItemCount
	
	cHtmlString += "['" + hb_StrToUTF8( Alltrim(hb_valToStr(Win_1.Grid_1.CellEx( i , 1 ))) ) + "', " + Alltrim(hb_valToStr(Win_1.Grid_1.CellEx( i , 2 ))) + "]"
	IF i < Win_1.Grid_1.ItemCount
		cHtmlString += ","
	ENDIF
	
	cHtmlString += CRLF
NEXT i

cHtmlString += "]);" + CRLF
cHtmlString += '// Set chart options' + CRLF
cHtmlString += "var options = {'title':'Sample Google Chart'," + CRLF
IF cChartType == 'PieChart3D'
	cHtmlString += "    'is3D': true,"
	cChartType := 'PieChart'
ENDIF
	
cHtmlString += "               'width':" + cChartWidth + "," + CRLF
cHtmlString += "               'height':" + cChartHeight + "};" + CRLF
cHtmlString += '// Instantiate and draw our chart, passing in some options.' + CRLF
cHtmlString += "var chart = new google.visualization." + cChartType + "(document.getElementById('chart_div'));" + CRLF
cHtmlString += "chart.draw(data, options);" + CRLF
cHtmlString += "}" + CRLF
cHtmlString += '</script>  </head>' + CRLF
cHtmlString += '<body>' + CRLF
cHtmlString += '<!--Div that will hold the pie chart-->' + CRLF 
cHtmlString += '<div id="chart_div" style="width: ' + cChartWidth + 'px; height: ' + cChartHeight + 'px"></div>' + CRLF
cHtmlString += '</body> </html>'

STRFILE( cHtmlString , cHtmlFile)

Win_1.Activex_1.Width := Win_1.t_Width.Value + 70
Win_1.Activex_1.Height := Win_1.t_Height.Value + 50
oActiveX:= GetProperty('Win_1','Activex_1','Object')

oActiveX:Silent := 1
oActiveX:Navigate( cLocalUrl , , , , cHeaders)

RETURN  
Bez tytułu.png
Bez tytułu.png (18.97 KiB) Viewed 722 times
You can customize the charts by preparing the correct html string. See the Google Chart documentation: https://developers.google.com/chart/int ... uick_start :idea:

User avatar
tonton2
Posts: 291
Joined: Sat Jun 29, 2013 1:26 pm
Location: Algerie
Has thanked: 7 times
Been thanked: 11 times
Contact:

Post by tonton2 » Tue Nov 27, 2018 1:02 pm

Merci beaucoup a vous,c'est très instructifs
L'Algerie vous salut
Y.TABET

User avatar
mustafa
Posts: 829
Joined: Fri Mar 20, 2009 11:38 am
DBs Used: DBF
Location: Alicante - Spain
Been thanked: 117 times
Contact:

Post by mustafa » Tue Nov 27, 2018 7:48 pm

Hola amigos
Felicidades por la aplicación "edk"
He modificado el Sample de "edk" con la opción de Base de datos de "Tonton2"
Haber que os parece ?
Saludos
Mustafa
*---------------------------------------------- Google -------------------------------------*
Hello friends
Congratulations on the "edk" application
I modified the "edk" Sample with the "Tonton2" database option
What do you think?
Regards
Mustafa :idea:
Attachments
API Google crea gráficas3.zip
(8.37 KiB) Downloaded 79 times

User avatar
tonton2
Posts: 291
Joined: Sat Jun 29, 2013 1:26 pm
Location: Algerie
Has thanked: 7 times
Been thanked: 11 times
Contact:

Post by tonton2 » Wed Nov 28, 2018 1:28 pm

Merci Mustafa
Excellent travail,c'est ce que je recherchais
L'Algerie vous salut
Y.TABET

User avatar
tonton2
Posts: 291
Joined: Sat Jun 29, 2013 1:26 pm
Location: Algerie
Has thanked: 7 times
Been thanked: 11 times
Contact:

Post by tonton2 » Thu Nov 29, 2018 12:12 pm

Bonjour a toute l’équipe,
Peut on faire le même exemple en utilisant simplement HMG et sans utiliser Google Chart
merci d'avance pour vos réponses
traduction google
Hello to all the team,
Can we do the same example using just HMG and without using Google Chart
Thank you in advance for your answers
L'Algerie vous salut
Y.TABET

User avatar
bpd2000
Posts: 1078
Joined: Sat Sep 10, 2011 4:07 am
Location: India
Has thanked: 197 times
Been thanked: 96 times

Post by bpd2000 » Thu Nov 29, 2018 12:25 pm

Refer samples at:

C:\hmg\SAMPLES\Controls\Graph\GRAPH_03
Untitled.png
Untitled.png (46.7 KiB) Viewed 612 times
BPD
Convert Dream into Reality through HMG

User avatar
mustafa
Posts: 829
Joined: Fri Mar 20, 2009 11:38 am
DBs Used: DBF
Location: Alicante - Spain
Been thanked: 117 times
Contact:

Post by mustafa » Thu Nov 29, 2018 2:03 pm


User avatar
tonton2
Posts: 291
Joined: Sat Jun 29, 2013 1:26 pm
Location: Algerie
Has thanked: 7 times
Been thanked: 11 times
Contact:

Post by tonton2 » Thu Nov 29, 2018 4:46 pm

merci beaucoup mon ami
L'Algerie vous salut
Y.TABET

Post Reply