How to pass object variable coming from API to JS script

[MauriceHeinze]

Hello,

I'm trying to figure out how I can pass the object variable coming from our API to the JS script running on jsreport. It never shows me my graph, no matter what I try. Only way it works is by providing the sample data directly in my script, but I need it dynamically from the API. When I console.log the object variable, it only shows object object, but I can access the values when I provide the whole path.

How do I access the whole object passed by the API in my script?

  <script>
     window.onload = function () {
        // ... Not necessary parts
        // Define your data object
        const dataObject = [
            {
                "B": [
                    {
                        "name": "RANDOM 1",
                        "data": [41.72141152000108, 58.89502181927351, 76.06863211854593, 93.24224241781837, 110.41585271709081, 127.58946301636323, 144.7630733156357, 161.9366836149081, 179.11029391418055, 196.283904213453, 213.45751451272542, 230.6311248119979, 247.80473511127033, 264.9783454105428, 282.1519557098152, 299.3255660090877, 316.4991763083601, 333.67278660763253, 350.84639690690506, 368.02000720617747, 385.1936175054499, 402.3672278047224, 419.5408381039948, 436.7144484032673, 453.88805870253975, 471.0616690018122, 488.2352793010847, 505.40888960035716, 522.5824998996296, 539.756110198902, 556.9297204981746, 574.1033307974469, 591.2769410967195, 608.450551395992, 625.6241616952643, 642.7977719945369, 659.9713822938094, 677.1449925930818, 694.3186028923543, 711.4922131916269, 728.6658234908992, 745.8394337901717, 763.0130440894443, 780.1866543887166, 797.3602646879892, 814.5338749872617, 831.7074852865342, 848.8810955858066, 866.0547058850792, 883.2283161843516, 900.4019264836242, 917.5755367828967, 934.7491470821691, 951.9227573814417, 969.0963676807141, 986.2699779799866, 1003.4435882792592, 1020.6171985785317, 1037.790808877804, 1054.9644191770765, 1072.1380294763492, 1089.3116397756216, 1106.485250074894, 1123.6588603741666, 1140.832470673439, 1158.0060809727117, 1175.1796912719842, 1192.353301571257, 1209.5269118705291, 1226.7005221698016, 1243.8741324690743, 1261.0477427683468, 1278.2213530676195, 1295.394963366892, 1312.5685736661642, 1329.7421839654369, 1346.9157942647093, 1364.089404563982, 1381.2630148632545, 1398.4366251625268, 1415.6102354617994, 1432.783845761072, 1449.9574560603446, 1467.131066359617, 1484.3046766588898, 1501.478286958162, 1518.6518972574347, 1535.8255075567072, 1552.9991178559799, 1570.1727281552523, 1587.346338454525, 1604.5199487537973, 1621.69355905307, 1638.8671693523424, 1656.0407796516151, 1673.2143899508876, 1690.3880002501603, 1707.5616105494325, 1724.7352208487052, 1741.9088311479777]
                    },
                    {
                        "name": "RANDOM 4",
                        "data": [103.38725109002272, 754.3305680435856, 1405.2738849971486]
                    }
                ],
                "A": [0, 59.40594059405941, 118.81188118811882, 178.21782178217822, 237.62376237623764, 297.029702970297, 356.43564356435644, 415.84158415841586, 475.2475247524753, 534.6534653465346, 594.059405940594, 653.4653465346535, 712.8712871287129, 772.2772277227723, 831.6831683168317, 891.0891089108911, 950.4950495049505, 1009.90099009901, 1069.3069306930693, 1128.7128712871286, 1188.1188118811879, 1247.5247524752472, 1306.9306930693065, 1366.3366336633658, 1425.742574257425, 1485.1485148514844, 1544.5544554455437, 1603.960396039603, 1663.3663366336623, 1722.7722772277216, 1782.178217821781, 1841.5841584158402, 1900.9900990098995, 1960.3960396039588, 2019.801980198018, 2079.2079207920774, 2138.6138613861367, 2198.019801980196, 2257.4257425742553, 2316.8316831683146, 2376.237623762374, 2435.643564356433, 2495.0495049504925, 2554.455445544552, 2613.861386138611, 2673.2673267326704, 2732.6732673267297, 2792.079207920789, 2851.4851485148483, 2910.8910891089076, 2970.297029702967, 3029.7029702970262, 3089.1089108910855, 3148.514851485145, 3207.920792079204, 3267.3267326732635, 3326.7326732673228, 3386.138613861382, 3445.5445544554414, 3504.9504950495007, 3564.35643564356, 3623.7623762376193, 3683.1683168316786, 3742.574257425738, 3801.980198019797, 3861.3861386138565, 3920.792079207916, 3980.198019801975, 4039.6039603960344, 4099.009900990094, 4158.415841584154, 4217.821782178214, 4277.227722772273, 4336.633663366333, 4396.039603960393, 4455.445544554453, 4514.851485148512, 4574.257425742572, 4633.663366336632, 4693.069306930692, 4752.4752475247515, 4811.881188118811, 4871.287128712871, 4930.693069306931, 4990.0990099009905, 5049.50495049505, 5108.91089108911, 5168.31683168317, 5227.7227722772295, 5287.128712871289, 5346.534653465349, 5405.940594059409, 5465.346534653469, 5524.752475247528, 5584.158415841588, 5643.564356435648, 5702.970297029708, 5762.376237623767, 5821.782178217827, 5881.188118811887, 5940.594059405947]
            },
            {
                "B": [
                    {
                        "name": "RANDOM 2",
                        "data": [150, 160, 170, 180, 190, 200, 210, 220, 230, 240, 250, 260, 270, 280, 290, 300, 310, 320, 330, 340, 350, 360, 370, 380, 390, 400, 410, 420, 430, 440, 450, 460, 470, 480, 490, 500, 510, 520, 530, 540, 550, 560, 570, 580, 590, 600, 610, 620, 630, 640, 650, 660, 670, 680, 690, 700, 710, 720, 730, 740, 750, 760, 770, 780, 790, 800, 810, 820, 830, 840, 850, 860, 870, 880, 890, 900, 910, 920, 930, 940, 950, 960, 970, 980, 990, 1000]
                    },
                    {
                        "name": "RANDOM 3",
                        "data": [41.72141152000108, 58.89502181927351, 76.06863211854593, 93.24224241781837, 110.41585271709081, 127.58946301636323, 144.7630733156357, 161.9366836149081, 179.11029391418055, 196.283904213453, 213.45751451272542, 230.6311248119979, 247.80473511127033, 264.9783454105428, 282.1519557098152, 299.3]
                    },
                ],
                "A": [0, 10, 20, 30, 40, 50, 60, 70, 80, 90, 100, 110, 120, 130, 140, 150, 160, 170, 180, 190, 200, 210, 220, 230, 240, 250, 260, 270, 280, 290, 300, 310, 320, 330, 340, 350, 360, 370, 380, 390, 400, 410, 420, 430, 440, 450, 460, 470, 480, 490, 500, 510, 520, 530, 540, 550, 560, 570, 580, 590, 600, 610, 620, 630, 640, 650, 660, 670, 680, 690, 700, 710, 720, 730, 740, 750, 760, 770, 780, 790, 800, 810, 820, 830, 840, 850, 860, 870, 880, 890, 900, 910, 920, 930, 940, 950, 960, 970, 980, 990, 1000]
            }
        ];

        generateCharts(dataObject);
     };
  </script>
  <div style="padding-left: 60pt; padding-right: 60pt">
     <!-- Charts will be dynamically inserted here -->
     <div id="chart_container"></div>
  </div>

</body>
</html>

[dhurbamis]

you need to define your function first in the js terminal. Once done, you can call the function by passing the data. for example
function isActive(value){
if(value=='success'){
return "Verified Clear";
}else{
return "Record Not Found";
}
}
for this function, you'll call it by using double curly brackets like below in template
<td style="font-size:12px !important ">{{isActive forms.status}}</td>
here, isActive is the function call and the forms.status is the argument.