echars相同option不同屬性切換

  1. 開發中可能會在同一區域對圖表進行切換渲染,但是設置同一個option中的series、legend等,切換會失敗
  2. 每次在設置option時要進行復制,使用jquery中的$.extend(true,{},optionChart)
    $setting_info.find('li').click(e=>{
    	var $elem = $(e.target);
    	console.log("data-",$elem.data());
    	var leftTable = $elem.data().data.leftTable;
    	var leftEcharData = $elem.data().data.leftEchar;
    	$setting_info.find('div[lay-filter="docDemoTabBrief1"]').find('.layui-this').removeClass('layui-this');
    	$setting_info.find('div[lay-filter="docDemoTabBrief2"]').find('.layui-this').removeClass('layui-this');
    	$setting_info.find('div[lay-filter="docDemoTabBrief3"]').find('.layui-this').removeClass('layui-this');
    	$elem .addClass('layui-this');
    	$("#show1").hide();
    		$("#show2").show();
    		if(leftTable){
    			var prop={
    				"elem": "#tableshow2"
    			}
    			layui.use(['table','element'], function(){
    					var table = layui.table;
    					prop.cols=leftTable.cols;
    					prop.data=leftTable.rows;
    					prop.limit=prop.data.length;
    					prop.height=$('#tableshow2').parent().height();
    					table.render(prop);		
    				});
    		}
    		if(leftEcharData){
    			var leftEchar = echarts.init(document.getElementById('leftEcharshow2'));
    			var option = $.extend(true,{},config.chartOption3);
    			option.title.text=leftEcharData.ptitle;
    			option.series=leftEcharData.series;
    			option.legend.data = leftEcharData.legend;
    			option.xAxis.data =leftEcharData.xAxis;
    			leftEchar.setOption(option,true);
    			leftEchar.resize();
    		}
    	
    	
    });

     

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章