加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

AJAX部分刷新以echarts饼图为例

发布时间:2020-12-16 02:10:02 所属栏目:百科 来源:网络整理
导读:script type="text/javascript" var xmlhttp; function startrefresh(){ xmlhttp=new XMLHttpRequest(); xmlhttp.open(POST,"/Sentiment/Sentiment.jsp",true); xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); //xmlhttp.s
<script type="text/javascript"> 
var xmlhttp; 
function startrefresh(){ 
xmlhttp=new XMLHttpRequest(); 
xmlhttp.open(POST,"/Sentiment/Sentiment.jsp",true); 
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); 
//xmlhttp.send("name=wk"); --需要传输参数时增加 
xmlhttp.onreadystatechange = function(){ 
if(xmlhttp.readyState == 4) 
if(xmlhttp.status == 200) 
document.getElementById("main1").innerHTML=xmlhttp.responseText; 
} 
} 
</script> 

  <div id="main1" style="height:350px;">武开英</div>

以下是echarts代码

 <script type="text/javascript">
  	var array_name = "<%=st_name.toString()%>";
    var array_value ="<%=st_good.toString()%>";
    
        // 路径配置
        require.config({
            paths:{ 
                'echarts' : './js/echarts','echarts/chart/bar' : './js/echarts','echarts/chart/line': './js/echarts','echarts/chart/pie': './js/echarts'
            }
        });
        
        // 使用
        require(
            [
                'echarts','echarts/chart/bar',// 使用柱状图就加载bar模块,按需加载
                'echarts/chart/line','echarts/chart/pie'
            ],DrawCharts
        );
        
         function DrawCharts(ec) {
                FunDraw3(ec);
            }
  	             function FunDraw3(ec) {
                // 基于准备好的dom,初始化echarts图表
                var myChart = ec.init(document.getElementById('main1')); 
				var option = {
				    title : {
				        text: '',subtext: '',x:'center'
				    },tooltip : {
				        trigger: 'item',formatter: "{a} <br/>{b} : {c} ({d}%)"
				    },legend: {
				        orient : 'vertical',x : 'left',data:["正面","负面","中立"],//这个一定要自己输入,学会调适程序
				    },toolbox: {
				        show : true,feature : {
				            mark : {show: true},dataView : {show: true,readOnly: false},restore : {show: true},saveAsImage : {show: true}
				        }
				    },calculable : true,series : [
				        {
				           name:'访问来源',type:'pie',radius : '100%',center: ['50%','60%'],data:(function(){
                                var res = [];
                                var len = -1;
                                while (len++<10) {
                                res.push({
                                name: array_name.split(",")[len],value:array_value.split(",")[len]
                                
                                });
                                }
                                return res;
                                })()    
				        }
				    ]
				};
				 myChart.setOption(option);      
            }
  </script>
这样可以部分刷新饼图。

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读