2017-01-15 7 views
0

私は現在、このJS Lib https://github.com/v-v-vishnevskiy/timesliderを使用して、いくつかの異なるタイムラインのチャートを作成しようとしています。jQuery関数内の配列を抽出します

「init_cells」の情報を一般的な方法で挿入して、何個のオブジェクト(この用語が正しいことを望むか)に気を付ける必要はありません。

はデモを参照するには、このコード例があります:

$('#slider123').TimeSlider({ 
    start_timestamp: current_time - 3600 * 12 * 1000, 
    init_cells: [ 
     { 
     '_id': 'c1', 
     'start': (current_time - (3600 * 5.4 * 1000) + 1234), 
     'stop': current_time - 3600 * 3.2 * 1000, 
     'style': { 
      'background-color': '#76C4FF' 
     } 
     }, 
     { 
     '_id': 'c2', 
     'start': (current_time - (3600 * 2.1 * 1000)) 
     } 
    ] 
}); 

これは、2つのオブジェクトのJSON配列のように私を探します!

すべてのオブジェクトを集中型アレイに保存するために、これを試しました。

var str1 = [{ 
     '_id':'c1','start':tV1Start,'stop':tV1End,'style':{'background-color':'#76C4FF'}}]; 
var str2 = [{ 
     '_id':'c2','start':tV1Start2,'stop':tV1End2,'style':{'background-color':'#76C4FF'}}]; 
var arr = []; 
arr.push(str1); 
arr.push(str2); 

しかし、どのように私は、アレイ内のすべてのストアドinforamtionを抽出することができ、「ARR」init_cellsのためのjQueryの関数の内部?

このスニップは

init_cells:arr 

が機能していない。しかし、これは動作します:

init_cells:arr[0] 

しかし、どのように、私はどのように多くの要素を世話をすることなく、jQueryの関数に変数ARRを渡すことで、フルタイムラインを作成することができます配列の内側にありますか?

答えて

0

これは、「集中型アレイ」では実際にはオブジェクトの配列の配列を格納していて、実際にはオブジェクトの配列が必要であり、追加の入れ子は必要ありません。 arrは配列で、str1str2を連結する代わりに、代わりにarrにプッシュしています。

したがって、あなたのコードが認識されていません間違った構造を生成します。

  • アレイ(これはあなたのarrある)
    • アレイ(これはあなたのstr1ある)
      • オブジェクトを
    • アレイ(これはあなたの01です)
      • 代わり.push().concat()を使用し、問題を解決するために、オブジェクト

var arr = [].concat(str1).concat(str2); 

そして、これは何である以下の構造を、生成されます。必要:

あなたの個々のオブジェクトの各

のための余分なラッピング配列を持つ

  • アレイ(これはあなたのarrある)
    • オブジェクト
    • オブジェクト
+0

THX。 –

0

は、外側[]を削除しますそれぞれから:

var str1 = {'_id':'c1','start':tV1Start,'stop':tV1End,'style':{'background-color':'#76C4FF'}}; 

あなたがこれを持っていた場合、あなたがしなければならないだろう、すべてのデータベースに保存され、データベースからの完全な配列を返されたすべてのようなものです:あなたのソリューションが動作している

$.getJSON('/path/to/data', function(responseData){ 
    $('#slider123').TimeSlider({ 
     start_timestamp: current_time - 3600 * 12 * 1000, 
     init_cells: responseData // pass response data array directly as property value 
    });  
}); 
関連する問題