怎样才能让图表不自动刷新echarts 柱状配置项内容和展示

把图表源码放在button的点击事件中，图表只显示一瞬间就初始化了，把点击事件去掉直接运行就可以正常显示。

       <div class="x-nav">
      <span class="layui-breadcrumb">
        <a href="">首页</a>
        <a href="">演示</a>
        <a>
          <cite>导航元素</cite></a>
      </span>
      <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新">
        <i class="layui-icon" style="line-height:30px">ဂ</i></a>
    </div>
    <div class="x-body">
      <div class="layui-row">
        <form class="layui-form layui-col-md12 x-so" id="form">
          <input type="text" name="year" id="year"  placeholder="请输入年份" autocomplete="off" class="layui-input" >
          <input type="text" name="month"  id="month"  placeholder="请输入月份" autocomplete="off" class="layui-input">
          <button id="button"  class="layui-btn"  lay-submit="" lay-filter="sreach"><i class="layui-icon">&#xe615;</i></button>

        </form>
      </div>
      </div>
        
        
        
        
    <!-- 为ECharts准备一个具备大小（宽高）的Dom -->
    <div id="main" style="width: 600px;height:400px;"></div>
    <script type="text/javascript">
   
//  myChart.showLoading();    //数据加载完之前先显示一段简单的loading动画
$("#button").click(function(){
	
	 var myChart = echarts.init(document.getElementById('main'));
	 // 显示标题，图例和空的坐标轴
	  var option={
	     title: {
	         text: '销售统计'
	     },
	     tooltip: {},
	     legend: {
	         data:['销量','销售额','成本','利润']
	     },
	     xAxis: {
	         data: []
	     },
	     yAxis: {},
	     series: [{
	         name: '销量',
	         type: 'bar',
	         data: []
	     },
	     {
	         name: '销售额',
	         type: 'bar',
	         data: []
	     },
	     {
	         name: '成本',
	         type: 'bar',
	         data: []
	     },
	     {
	         name: '利润',
	         type: 'bar',
	         data: []
	     }
	     ]
	 };
	  myChart.setOption(option);
	
	
	
 var names=[];    //类别数组（实际用来盛放X轴坐标值）
 var nums=[];    //销量数组（实际用来盛放Y坐标值）
 var price=[];
 var profits=[];
 var cost=[];


 var year=document.getElementById('year').value;
 var month=$("#month").val();
 alert(year);
 alert(month);
//  alert($("#form").serialize());

//  var date = new Date();
//  var year = date.getFullYear();
//  var month = ("0" + (date.getMonth() + 1)).slice(-2);
 var time=year+"-"+month;
 $.ajax({
		url:"http://localhost:8080/cwdbs/selectShopByTime",
		type:"post",
		data:{time:time},
// 		contentType:"application/json;charset=UTF-8",
		dataType:"json",
		success:function(data){  
// 			 alert(data);
//              alert(JSON.stringify(data));
//           var a=JSON.stringify(data);
            if(data){
            	 for(var i=0;i<data.length;i++){       
                     names.push(data[i].shopname);    //挨个取出类别并填入类别数组
                   }
            	 for(var i=0;i<data.length;i++){       
                     nums.push(data[i].sales);    //挨个取出销量并填入销量数组
                   }
            	 for(var i=0;i<data.length;i++){       
                     price.push(data[i].price*data[i].sales);    //挨个取出销售额并填入销量数组
                   }
            	 for(var i=0;i<data.length;i++){       
            		 cost.push(data[i].sales*data[i].cost);    //挨个取出成本并填入花费数组
                   }
            	 for(var i=0;i<data.length;i++){       
            		 profits.push((data[i].price-data[i].cost)*data[i].sales);    //挨个取出利润并填入销量数组
                   }
            	 
//             	 myChart.hideLoading();    //隐藏加载动画
                 myChart.setOption({        //加载数据图表
                     xAxis: {
                         data: names
                     },
                     series: [{
                         // 根据名字对应到相应的系列
                         name: '销量',
                         data: nums
                     },
                     {
                         // 根据名字对应到相应的系列
                         name: '销售额',
                         data: price
                     },
                     {
                         // 根据名字对应到相应的系列
                         name: '成本',
                         data: cost
                     },
                     {
                         // 根据名字对应到相应的系列
                         name: '利润',
                         data: profits
                     }]
                 });
            }

		},
		error:function(){
			alert("失败");
		}
	});
 alert("ceshi:");
})
 

    </script>