现在遇到的问题是:不知道easyUI的datagrid与echarts的图表如何进行切换(easyUI的table标签与echarts的div标签),点击饼状图可以出现图形,但再点击表格就出不来图形了??
写的前台代码:
html:
<div>
        <input id="bg" type="radio" name="sex" value="man"/>表格
        <input id="bzt" type="radio" name="sex" value="wman"/>饼状图
       <input id="zzt" type="radio" name="sex" value="woman"/>柱状图
</div>
<div id="chartmain" style="width:600px; height: 400px;">
<!-- 表格 -->
<table id = "dkxx" ></table>
</div>
js:
       //icheck
$("#bg,#bzt,#zzt").iCheck({
       checkboxClass: 'icheckbox_square-green',
       radioClass: 'iradio_square-green',
       increaseArea: '20%'
   }).on('ifChecked', function(event){
   if(event.target.id=="bg"){
    //初始化echarts实例
        var myChart = echarts.init(document.getElementById('chartmain'));
        //dispose():释放图表实例;
        myChart.clear();
   $('#dkxx').datagrid({  /*allData match  noMatch */
      url:'dkxx.json',
          rownumbers:true, //显示列号
          fitColumns:true, //列自适应
          queryParams:{},
          columns:[[
              {field:'dkbm',title:'地块编码',align:'center'},
              {field:'ydlx',title:'用地类型 ',align:'center'},
              {field:'ydlxdm',title:'用地类型代码',align:'center'},  
              {field:'ssgddy',title:'所属供电单元',align:'center'},
              {field:'gdqylx',title:'供电区域类型',align:'center'},
              {field:'zdmj',title:'占地面积',align:'center'},
              {field:'yxgdmj',title:'有效供电面积',align:'center'},
              {field:'rjl',title:'容积率',align:'center'},
              {field:'jzmj',title:'建筑面积',align:'center'}    
          ]]
      });
  
   }
       /* 饼状图  */
   if(event.target.id=="bzt"){
   var option = {
               title:{
                   text:'各类用地类型面积占比',
                  left:'center'
               },    
             tooltip:{
                  trigger:'item',
                  formatter:function(data){                   
                  console.log(data.percent.toFixed(2))                
                  return data.seriesName + "<br/>"+ data.name+ " : " + data.value + " ("+data.percent.toFixed(2)+"%)";
                  /* return "{a} <br/>{b} : {c} ({d}%)"  */
                  }                
                 },
                  legend: {
                  type: 'scroll',
                  orient: 'vertical',
                  right: 10,
                  top: 20,
                  bottom: 20,
                  data:['Android','IOS','PC','Ohter']
                },
               series:[{
                   name:'访问量',
                   type:'pie',    
                   radius:'60%', 
label: { 
normal: { 
show: true, formatter: "{a} \n{b} : {c} ({d}%)" 

},
                   data:[
                       {value:500,name:'Android'},
                       {value:200,name:'IOS'},
                       {value:360,name:'PC'},
                       {value:100,name:'Ohter'}
                   ]
               }]
           };
   }
var myChart = echarts.init(document.getElementById('chartmain'));
 myChart.setOption(option,true);