Atozed Forums
Passing Delphi variables to Javascript function. - Printable Version

+- Atozed Forums (https://www.atozed.com/forums)
+-- Forum: Atozed Software Products (https://www.atozed.com/forums/forum-1.html)
+--- Forum: IntraWeb (https://www.atozed.com/forums/forum-3.html)
+---- Forum: English (https://www.atozed.com/forums/forum-16.html)
+----- Forum: IntraWeb General Discussion (https://www.atozed.com/forums/forum-4.html)
+----- Thread: Passing Delphi variables to Javascript function. (/thread-1929.html)



Passing Delphi variables to Javascript function. - thiagorod - 09-01-2020

Hello,

I have this Javascript function (charting library) that takes an array of values as a variable, like this:

data: [22,61,64,35,91,59,62,91,124,94,77,196,309,147,102,107,199,36,0,0,0,0,0,0],

My doubt is how to make it read a Delphi array as the data input, I mean, how to transfer the values to this JS array.
Sorry if this is simple to do.

Regards,


RE: Passing Delphi variables to Javascript function. - kudzu - 09-01-2020

How does the chart take the input on the Javascript side?

How are you emitting the necessary js/html to create the chart?


RE: Passing Delphi variables to Javascript function. - thiagorod - 09-01-2020

Yes, the HTML and the JS are working fine, with the constants taken by the script to plot the line chart.

This is the script where the values are inserted. The line in bold is where the array of variables or values from Delphi should go. It represents points on the y axis. 

l1 = new RGraph.SVG.Line({
        id: 'cc1',
        data: [22,61,64,35,91,59,62,91,124,94,77,196,309,147,102,107,199,36,0,0,0,0,0,0],
        options: {
            key: ['Consumo (kWh)'],
            keyColorShape: 'circle',
            keyTextSize: 10,
            keyOffsetx: -220,
            marginTop: 35,
            filled: true,
            colors: ['#058DC7'],
            linewidth: 3,
            tickmarksStyle: 'filledcircle',
            filledOpacity:  0.75,
            filledColors:  ['#E6F4FA'],
            textSize: 8,
            yaxis: false,
            yaxisScaleMax: 400,
            yaxisLabelsCount: 2,
            xaxis:false,
           
            // The X axis labels for the chart
            xaxisLabels: [
                '00:00','','','','04:00','',
                '','','08:00','','','',
                '12:00','','','','16:00','',
                '','','20:00','','','23:00'
            ],

            backgroundGridBorder: false,
            backgroundGridVlines: false,
            backgroundGridHlinesCount: 2
        }
    }).draw();


RE: Passing Delphi variables to Javascript function. - Encina - 09-02-2020

//DataTables
JavaScript.Text := ''
+ 'function LoadData(DataSet) {'
+ ' var table = $("#Tab_' + _TName + '").DataTable();'
+ ' table.clear();'
+ ' table.rows.add( DataSet );'
+ ' table.draw( false );'
+ '}';


ja := TJsonArray.Create; //uses JsonDataObjects
...
WebApplication.CallBackResponse.AddJavaScriptToExecuteAsCDATA('LoadData(' + ja.ToJSON(True) + ');');


RE: Passing Delphi variables to Javascript function. - thiagorod - 09-03-2020

Great! Thank you.

Regards,