Reload nvd3 chart after get ajax data

Question

I use nvd3 to draw bar chart with data get from ajax request.

When I click on button it will do the ajax request and send new data for the chart.

The request works fine and i get the data correctly from ajax, the only problem is that the chart doesn't reload.

I try to do this:

<script type='text/javascript'>
var chart;
var data = [{key: 'A', values: [{'label' : '2014' , 'value' : 9}....;
nv.addGraph(function () {
   if (chart) {
      chart.remove();
   }
   chart = nv.models.multiBarChart()
           .x(function (d) { return d.label })
           .y(function (d) { return d.value })
   chart.yAxis
            .tickFormat(d3.format(',.2f'));
   d3.select('#chart1 svg')
            .datum(data)
            .call(chart);
  nv.utils.windowResize(chart.update);
  return chart;
  });

  function test() {
       value = 2;
       $.ajax({
              type: "POST",
              url: "index.aspx/Getval",
              data: '{val: "' + value + '" }',
              contentType: "application/json; charset=utf-8",
              dataType: "json",
              success: function (response) {
                       keyValue = response.d;
                       alert(keyValue); // show [{key: 'A', values: [{'label' : '2014' , 'value' : 9}....
                       data = keyValue;
                       $("#chart1 svg").empty();
                       chart.update();
                       }
              });
           }
 </script>
 <input type="button" onclick="javascript: test();" value="test"/>
 <div id="chart1">
 <svg></svg>                                    
 </div> 

Any idea about why I can't update the chart? Thanks