pe:gChart browser shows no content until refreshed

Question

Hi

when loading a page with a pe:gChart my browser turns white and I get the following browser console error:

"Uncaught Error: The container #form:j_id_6c:chartForm:gChart is not defined."

After refreshing the page (F5) everything works fine, the chart is displayed correctly etc.

Code:

 <h:form id="chartForm" style="text-align: center;">
        <div id="gChartDiv">
            <pe:gChart value="#{data.testModel}" title="Test"
                rendered="#{!data.noDataYet}" id="gChart">
            </pe:gChart>
        </div>
    </h:form>

Already posted on primefaces forums here, but since the pfe and pf versions are set in ivy they couldn't really help.

Any idea on fixing this?

Cheers

Accepted Answer

This sample works in Ivy: https://www.primefaces.org/showcase-ext/sections/gchart/basic.jsf;jsessionid=node0gzhije8myrwx1x5550c6oe8h0345257.node0

I did the following:

.xhtml

<pe:gChart value="#{data.chartModel}" title="How Much Pizza I Ate Last Night">
</pe:gChart>

data model

chartModel > org.primefaces.extensions.component.gchart.model.GChartModel

Java class

package test;
import java.util.Random;
import org.primefaces.extensions.component.gchart.model.GChartModel;
import org.primefaces.extensions.component.gchart.model.GChartModelBuilder;
import org.primefaces.extensions.component.gchart.model.GChartType;

public class ChartModelCreator  {

    private Random random = new Random();  
    private int mushrooms = random.nextInt(10);  
    private int onions = random.nextInt(10);  
    private GChartModel chartModel = null;

    public ChartModelCreator() {  
        chartModel = new GChartModelBuilder()
                .setChartType(GChartType.PIE)  
                .addColumns("Topping", "Slices")
                .addRow("Mushrooms", mushrooms)  
                .addRow("Onions", onions)
                .build();  
    }

    public GChartModel getChartModel(){  
        return chartModel;  
    }

}

ivy logic Directly after start() make an ivy script step, which applys

import test.ChartModelCreator;
ChartModelCreator creator = new ChartModelCreator();
in.chartModel = creator.getChartModel();

How das your model look like? Which browser version do you use?

pe:gChart browser shows no content until refreshed

Follow this question

Related questions