Kreporter 3.1 is no longer displaying Google Charts

We have a license for 3.1 extension and have noticed recently that are charts aren’t always displaying and now not at all. We are using Kreporter with Suitecrm 7.8.31.

I see this error in the console log and wonder if you have any ideas about the problem.

index.php?module=KReports&action=DetailView&record=4f85b03d-7466-0643-5faa-5dae184cdf5d:1107 Uncaught TypeError: Cannot read property ‘ChartWrapper’ of undefined
at index.php?module=KReports&action=DetailView&record=4f85b03d-7466-0643-5faa-5dae184cdf5d:1107
(anonymous) @ index.php?module=KReports&action=DetailView&record=4f85b03d-7466-0643-5faa-5dae184cdf5d:1107

Thanks,
Dianna

Dianna,

Have you used SuiteCRM 7.8.31 all along or did you make an update to this version recently?

Val

We are using Google Charts. We have made no changes but noticed that the reports would intermittently fail to display until we did one or two refreshes. And as of yesterday, this does not work for the charts don’t display at all.
Thanks,
Dianna

I am afraid the google library in use is old one.
I am checking if there is a way for simple update

I have the code to make this work for Kreporter 3.1.

Edit the file: modules/KReports/Plugins/Visualization/googlecharts/kGoogleCharts.php

Lines 24-31 (function getHeader()):
public function getHeader() {`
// STIC 14/05/2020: Update regarding the loading of the Google Graphic libraries
// $coreString = “”;
$coreString = “”;
return $coreString;
}
Lines 45-71 (function getItem()):
public function getItem($thisDivId, $thisReport, $thisParams, $addReportParams = array()) {

    $googleData = $this->getChartData($thisReport, $thisParams, 0, $addReportParams);
    $chartData = $this->wrapGoogleData($googleData, $thisDivId, $thisParams, 0 , $addReportParams);

    $chartDataString = '<script type="text/javascript">';

    // STIC 14/05/2020: Update regarding the loading of the Google Graphic libraries
    $chartDataString .= "google.charts.load('current'); ";
    $chartDataString .= "google.charts.setOnLoadCallback(drawVisualization); ";
    $chartDataString .= "function drawVisualization() { ";
    // STIC 14/05/2020: End of update

    $chartDataString .= $thisParams['uid'] . " = new Object({
            uid: '" . $thisParams['uid'] . "',
            chartWrapper: new google.visualization.ChartWrapper(" . json_encode($chartData) . "), 
            update: function(chartData){
                this.chartWrapper.setDataTable(chartData);
                this.chartWrapper.draw();
            }
            });
            document.addEventListener('load', " . $thisParams['uid'] . ".chartWrapper.draw());";
    $chartDataString .= "}"; // STIC Update 14/05/2020
    $chartDataString .= '</script>';

    return $chartDataString;
}

You can see the changes where STIC updates comments are.

@maretval could you please check my topic? Kreporter 3.1 and Security Groups filtering records

Thanks

1 Like

Thank you very much for your efforts. I will make these changes and test it.
Thanks again,
Dianna

Hi Dianna,

Did you manage to get them working again?

Thanks,

Rachel,
I just started looking at it yesterday and did not get it working from the code above. But today I made the following changes to the code above and got it working.

Change the line in getHeader from:
$coreString = “”;
To:
$coreString = “”;

AND change the line in getItem from:
$chartDataString .= "google.charts.load(‘current’); ";
To:
$chartDataString .= "google.charts.load(‘current’, {packages: [‘corechart’]}); ";

HTH,
Dianna

Now I see what happened to albertostic because the same thing has happened to me and I don’t know how to fix it. When the post displays in HTML, the required code is not visible. When I look at it raw, the code is correct.

To see what needs to go in the getHeader modified line following this link:

https://developers.google.com/chart/interactive/docs/basic_load_libs#loading-details

Dianna

Great job community!

My solution for KReporter 3.0.6 inspired by albertostic

getHeader():

getItem(): I prefere to create unique function names for setOnLoadCallback in case you have multiple charts.

$chartDataString = '<script id="' . $thisDivId . '_script" type="text/javascript">';
$chartDataString .= 'google.charts.setOnLoadCallback(drawVisualization'. $thisParams['uid'].');';
      $chartDataString .= 'function drawVisualization' . $thisParams['uid'].'(){';
      $chartDataString .= $thisParams['uid'] . " = new Object({
....
      $chartDataString .= '}';