2011-08-16 12 views
1

EDIT:ANSWERED これを解決しました。 Stack Overflowへの投稿は実際に私に答えを指摘しました!外部データをExtJS(Sencha Touch)チャートに入れることができません

基本的に、Sencha TouchでExt.data.JsonStoreについて面白いことがあるようです。たぶんデフォルトの一部が期待どおりのものではないかもしれません。 How to parse this format of xml data?から次のコード

(それがneccessaryだったかどうかわからない)test.jsonにファイルを改名 は、

Ext.regModel('tester', { 
     idProperty: 'name', 
     fields: ['name', 'data1', 'data2', 'data3'] 
    }); 
     var store = new Ext.data.Store({ 
     model: 'tester', 
     autoLoad: true, 
     proxy: { 
      type: 'ajax', 
      method: 'GET', 
      url: 'test.json', 
      reader: { 
       type: 'json', 
       root: 'test' 
      } 
     }, 
     listeners: { 
      load: function(obj, records){ 
       Ext.each(records, function(rec){ 
        console.log(rec.get('name')); 
       }); 
      } 
     } 
    }); 

を働いていた元の質問

私はいくつかの主要なものがあります確信しています私は正しくはありませんが、私はJSONソースからチャートにデータを取得するのに問題があります。

これは以下の私の店舗コードで、動作しません。

window.store1 = new Ext.data.JsonStore({ 
     autoload: true, 
     url: 'test.php', 
     root: 'test', 
     idProperty: 'name',  
     fields: ['name', 'data1', 'data2', 'data3'] 
    }); 

ここ

test.phpを=

{ "test" : { 
     "data": [ 
      { "name": "Mon", "data1":47.5, "data2":20, "data3":10}, 
       { "name": "Tue", "data1":30, "data2":30, "data3":30}, 
       { "name": "Wed", "data1":31.1, "data2":40, "data3":20}, 
       { "name": "Thu", "data1":21.1, "data2":20, "data3":30}, 
       { "name": "Fri", "data1":20.7, "data2":20, "data3":10}, 
       { "name": "Sat", "data1":22.4, "data2":30, "data3":30}, 
       { "name": "Sun", "data1":28.3, "data2":40, "data3":20} 


     ] 
    } 
    } 

Iコードを渡す場合チャート系列以下のようにデータが正しく描画されています。

window.store1 = new Ext.data.JsonStore({ 

      fields: ['name', 'data1', 'data2', 'data3'], 
      data: [ 
      { "name": "Mon", "data1":47.5, "data2":20, "data3":10}, 
      { "name": "Tue", "data1":30, "data2":30, "data3":30}, 
      { "name": "Wed", "data1":31.1, "data2":40, "data3":20}, 
      { "name": "Thu", "data1":21.1, "data2":20, "data3":30}, 
      { "name": "Fri", "data1":20.7, "data2":20, "data3":10}, 
      { "name": "Sat", "data1":22.4, "data2":30, "data3":30}, 
      { "name": "Sun", "data1":28.3, "data2":40, "data3":20} 
      ] 
     }); 

チャートデモ(新しい煎茶タッチチャート)は、このような例とデータアレイを生成し、Iは、単純なJSON源を介して取り込むための例を見つけることができません。

window.generateData = function(n, floor) { 
      var data = [], 
       p = (Math.random() * 11) + 1, 
       i; 

      floor = (!floor && floor !== 0) ? 20 : floor; 

      for (i = 0; i < (n || 12); i++) { 
       data.push({ 
        name: Date.monthNames[i % 12], 
        2008: Math.floor(Math.max((Math.random() * 100), floor)), 
        2009: Math.floor(Math.max((Math.random() * 100), floor)), 
        2010: Math.floor(Math.max((Math.random() * 100), floor)), 
        data1: Math.floor(Math.max((Math.random() * 100), floor)), 
        data2: Math.floor(Math.max((Math.random() * 100), floor)), 
        data3: Math.floor(Math.max((Math.random() * 100), floor)), 
        data4: Math.floor(Math.max((Math.random() * 100), floor)), 
        data5: Math.floor(Math.max((Math.random() * 100), floor)), 
        data6: Math.floor(Math.max((Math.random() * 100), floor)), 
        data7: Math.floor(Math.max((Math.random() * 100), floor)), 
        data8: Math.floor(Math.max((Math.random() * 100), floor)), 
        data9: Math.floor(Math.max((Math.random() * 100), floor)), 
        time: Math.floor(Math.max((Math.random() * 100), floor)), 
        registrations: Math.floor(Math.max((Math.random() * 100), floor)), 
        hours: Math.floor(Math.max((Math.random() * 100), floor)), 
        iphone: Math.floor(Math.max((Math.random() * 100), floor)), 
        android: Math.floor(Math.max((Math.random() * 100), floor)), 
        ipad: Math.floor(Math.max((Math.random() * 1000), floor)) 
       }); 
      } 
      return data; 
     }; 

window.store2 = new Ext.data.JsonStore({ 
      fields: ['name', '2008', '2009', '2010', 'data4', 'data5', 'data6', 'data7', 'data8', 'data9'], 
      data: generateData(6, 20) 
     }); 

誰かが系列データがロードされていない理由として正しい方向に私を指すことができれば、私は本当に感謝します。

答えて

0

あなたはtest.phpへの正しいパスを持っていて、別のサイトから開こうとしていないと思います。あなたのJSONは有効ですか? test.phpがロードされていることを(FireBugのようなもので)確認できますか?

数値だけを引用符で囲んで()、安全面に置くこともできます。

+0

私はあなたが正しいと思うし、test.phpをロードしていないと思います。これは現在ローカルサーバー上にあります。 PHPファイルのjsonはタグで囲む必要がありますか? – Alistair

+0

@Alistair通常のブラウザのウィンドウ/タブで 'test.php'を開くことができますか? JSONを表示/確認するにはhttps://addons.mozilla.org/en-US/firefox/addon/jsonview/を使用してください。 – Vlad

0

モデルを使用し、リーダーでプロキシを適切に設定してください。私はあなたのルートがtest.dataでなければならないと信じています

2
window.generateData = function() { 
     var data = [{name:"January", iphone:43, android:70, blackberry:20}, {name:"February", iphone:23, android:10, blackberry:20}, {name:"March", iphone:64, android:47, ipad:66, blackberry:20}, {name:"April", iphone:12, android:29, ipad:67, blackberry:20}, {name:"May", iphone:62, android:97, ipad:94, blackberry:20}]; 
     return data;   
     }; 
関連する問題