PrimeFaces Chart not updating with Ajax Requests

Question

Please I need help with Primefaces charts. It's supposed to load, with Ajax, a different chart based on a selected item in the dropdownbox after clicking a command button. The problem is that the chart is not updated although the selected item value is set correctly. Below the html and the Managed Bean Code.

xhtml

<h:form>
    <h:selectOneMenu value="#{chart.country}">
        <f:selectItem itemValue="0" itemLabel="Item1" />
        <f:selectItem itemValue="1" itemLabel="Item2" />
        <f:selectItem itemValue="2" itemLabel="Item3" />
    </h:selectOneMenu>
    <p:commandButton value="View"  update="votes" />
       <p:chart  id="votes" type="pie" model="#{chart.livePieModel}" style="width:400px;height:300px"/>
</h:form>

Java Code

 private String country = "0";
 private PieChartModel livePieModel = new PieChartModel();
    public String getCountry() {
        return country;
    }
    public void setCountry(String country) {
        this.country = country;
    }

    public PieChartModel getLivePieModel() {

        if (Integer.parseInt(this.country) == 1)
            refreshChart();
        return livePieModel;
    }

    public void refreshChart() {
        int random1 = (int) (Math.random() * 1000);
        int random2 = (int) (Math.random() * 1000);
        livePieModel.getData().put("Candidate 1", random1);
        livePieModel.getData().put("Candidate 2", random2);
        livePieModel.setTitle("Votes");
        livePieModel.setLegendPosition("ne");

    }