注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

前端开发那点事儿

冒犯之处,敬请谅解。

 
 
 

日志

 
 
 
 

jquery(mobile) 跨域获取数据  

2013-03-20 09:36:18|  分类: 默认分类 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |
<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>Example</title>
        <script src="http://evanwukong.blog.163.com/blog/jquery-1.8.2.min.js"></script>
        <script src="http://evanwukong.blog.163.com/blog/jquery.mobile-1.3.0.min.js"></script>
        <script type="text/javascript" src="http://evanwukong.blog.163.com/blog/./ichart-1.0.min.js"></script>
        <script type="text/javascript">
        iChart(function(){
            $.support.cors = true;
            $.mobile.allowCrossDomainPages=true;

            var mappingArr = {
                   'quanrdl': '日电量'
                   ,'gaofzd': '高峰最大负荷'
                   ,'digzx': '低估最小负荷'
                   ,'gaoffhl': '高峰负荷率'
            };

            var typeMappingArr = {
                   'quansh': '全省发电'
                   ,'shengw': '省网发电'
                   ,'tongp': '通调用电'
            };

            var orderArr = [];


            //JQuery JSONP Support  
            var url = "http://192.168.1.110/Ajax.php?symbol=IBM&callback=?";  
            jQuery.getJSON(url, function(retData){  


                var retData = retData.data;
                alert(retData)
                var valueArr = {'quanrdl': [],'gaofzd': [],'digzx': [],'gaoffhl': []};
                for(var i = 0;i < retData.length;i++){
                    orderArr.push(typeMappingArr[retData[i].EPNID]);
                    valueArr['quanrdl'].push(retData[i].quanrdl);
                    valueArr['gaofzd'].push(retData[i].gaofzd);
                    valueArr['digzx'].push(retData[i].digzx);
                    valueArr['gaoffhl'].push(retData[i].gaoffhl);
                }
    
    
                var data = [{
                    'name': mappingArr.quanrdl
                    ,'color': 'orange'
                    ,'value': valueArr.quanrdl
                },{
                    'name': mappingArr.gaofzd
                    ,'color': 'green'
                    ,'value': valueArr.gaofzd
                },{
                    'name': mappingArr.digzx
                    ,'color': 'gold'
                    ,'value': valueArr.digzx
                },{
                    'name': mappingArr.gaoffhl
                    ,'color': 'red'
                    ,'value': valueArr.gaoffhl
                }];
                
                var chart = new iChart.ColumnMulti3D({
                    render : 'canvasDiv'
                    ,data: data
                    ,zRotate: 45
                    ,animation: true
                    
                    ,label: {
                        fontsize: 30
                        ,height: 40
                    }
                    ,labels: orderArr
                    
                    ,title :{
                        text:'全网发电信息'
                        ,fontsize: 60
                        ,height: 80
                    }
                    ,subtitle: {
                        text:'电量:万千万时,负荷:千千瓦'
                        ,fontsize: 30
                        ,height: 40
                    }
                    ,fit: true
                    ,padding: 30
                    
                    ,height: '66%'
                    
                    ,turn_off_touchmove: true
                    ,default_mouseover_css: false
                    
                    ,coordinate:{ //设置坐标系
                        scale:[{
                            position:'left'
                            ,border:true
                            ,listeners:{
                                parseText:function(t,x,y){
                                    return {text:t+" "};
                                }
                            }
                            ,label: {
                                fontsize: 30
                            }
                        }]
                        
                        ,grid_line_width: 2
                        
                        ,ignoreOverlap: false
                        ,wall_style: [
                            {color: '#333'}
                            ,{color: '#333'}
                            ,{color: '#333'}
                            ,{color: 'white'}
                            ,{color: 'grey'}
                            ,{color: 'grey'}
                        ]
                        ,pedestal_height: 0
                        ,board_deep: 2
                        ,gradient: false
                     }
                     ,sub_option: {
                        label: {
                            fontsize: 30
                            ,color: 'white'
                        }
                        ,mini_label: true
                    }
                    ,zScale:1
                    ,bottom_scale:1.1
                    ,legend:{
                        enable: true
                        ,align: 'center'
                        ,valign: 'bottom'
                        ,row:1
                        ,column: 'max'
                        ,fontsize: 40
                        ,border: false
                        ,sign_size: 40
                    }
                    
                });
                chart.draw();//调用draw方法进行绘图
                chart.eventOff();



            
            });
            
        });
    
        </script>
    </head>
    <body>
        <div id="canvasDiv"></div>
    </body>
</html>





<?php
require_once 'common.php';
$DBConfig = array(
    "username" =>'root'
    ,"password" => 'a12345'
    ,"hostname" => '127.0.0.1'
    ,"hostname" => '127.0.0.1'
    ,"database" => 'shanxi'
    ,"charset" => 'utf8'
);

$mappingArr = array(
    'quanrdl' => '日电量'
    ,'gaofzd' => '高峰最大负荷'
    ,'digzx' => '低估最小负荷'
    ,'gaoffhl' => '高峰负荷率'
);

$colorMappingArr = array(
    'quanrdl' => 'orange'
    ,'gaofzd' => 'green'
    ,'digzx' => 'gold'
    ,'gaoffhl' => 'red'
);

$typeMappingArr = array(
    'quansh' => '全省发电'
    ,'shengw' => '省网发电'
    ,'tongp' => '通调用电'
);

$dataObj = new QuanWangFaDian(GetDBConn($DBConfig));

//if(isset($_GET['date']) && $_GET['date'] == '20130305'){

echo '<pre>';

    echo $_GET['callback'] . '(' . json_encode(
        array(
            'success' => true
//            ,'symbol' => 'IBM'
            ,'data' => $dataObj->listAll()
        )
    ) . ')';
?>
  评论这张
 
阅读(2917)| 评论(0)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017