0

JavaScript では、次のようにデータ ポイントのリストをレンダリングしています。

<ul class="site-stats">
   <li>   
      <div data-title="Cleared Orders" data-pts="[gd(2013, 9 , 9), 3],[gd(2013, 9 , 10), 1],[gd(2013, 9 , 13), 1],[gd(2013, 9 , 16), 1]" class="cc">
                   <i class="icon=arrow-right"></i>
                   <strong>6</strong> 
                   <small>Cleared Orders</small>
      </div>
   </li>
   <li>
               <div data-title="Customers Added" data-pts="[gd(2013, 9 , 9), 5],[gd(2013, 9 , 10), 2]" class="cc">
                   <i class="icon=arrow-right"></i>
                   <strong>7</strong> 
                   <small>Customers Added</small>
               </div>
   </li>
   <li>
               <div data-title="Counts Ran" data-pts="[gd(2013, 9 , 9), 8],[gd(2013, 9 , 10), 11],[gd(2013, 9 , 11), 7],[gd(2013, 9 , 12), 1],[gd(2013, 9 , 16), 5]" class="cc">
                   <i class="icon=arrow-right"></i>
                   <strong>32</strong> 
                   <small>Counts Ran</small>
               </div>
   </li>
   <li>
               <div data-title="Pending Orders" data-pts="" class="cc">
                   <i class="icon=arrow-right"></i>
                   <strong>0</strong> 
                   <small>Pending Orders</small>
               </div>
   </li>
   <li>
               <div data-title="Failed Orders" data-pts="" class="cc">
                   <i class="icon=arrow-right"></i>
                   <strong>0</strong> 
                   <small>Failed Orders</small>
               </div>
   </li>
   <li>
               <div data-title="Records Delivered" data-pts="[gd(2013, 9 , 9), 25970],[gd(2013, 9 , 10), 2500],[gd(2013, 9 , 13), 2023],[gd(2013, 9 , 16), 400]" class="cc">
                   <i class="icon=arrow-right"></i>
                   <strong>30893</strong> 
                   <small>Records Delivered</small>
               </div>
  </li>
 </ul>

基本的に、data-pts はフロート チャートの値を保持します。Onclick フロー チャートの内容を次のように変更したい:

$(".cc").click(function(e)
    {
        var data = $(this).data('pts');
        console.log(data);
        plot.setData([data]);
        plot.setupGrid();
        plot.draw();

    });

これを行うと、var データはまっすぐな文字列として返されます...本当に奇妙なのは、console.log(data) が期待する配列を提供してくれることです。もちろん、これにより、フロートチャートが新しいデータで更新されなくなります...取得している文字列を生のjavascript配列に変換する方法はありますか? 他の提案も受け付けています...

ありがとう！

4

2 に答える 2

2

あなたが得たのは文字列です。eval()文字列を評価してオブジェクトに変換するために使用できます。

var data = $(this).data('pts');
data = eval(data);
于 2013-09-16T23:15:44.397 に答える
0

あなたはこれを試すことができます

$(function(){
    $(".cc").click(function(e)
    {
        var data = $(this).data('pts');
        if(data.length) {
            var reg = /\]\,\[/;
            var matches = data.replace('[','').substring(0, data.length-2).split(reg);
            var arr = [];
            arr = matches.map(function(i){
                var a = [];
                a[0] = i.substring(0, i.lastIndexOf(','));
                a[1] = i.substring(i.lastIndexOf(' ')+1);
                return a;
            });

            console.log(arr[0][0]); // gd(2013, 9 , 9)
            console.log(arr[0][1]); // 3
            console.log(arr[3][0]); // gd(2013, 9 , 16)
            console.log(arr[3][1]); // 1
        }
    });
});

デモ。 また、eval(data)関数呼び出しをすべてまとめて評価します。

于 2013-09-17T01:18:49.940 に答える