1

次のコードは、JSON 文字列からスパークライン パイ チャートを作成します。

//Display Visitor Screen Size Stats

$.getJSON('models/ucp/traffic/traffic_display_bos.php',
{   
    type: 'ss',
    server: server,
    api: api,
    ip: ip,
},
function(data)
{
    //alert(data.screens);
    $('#traffic_bos_ss').sparkline(data.views,
    {
        type: "pie",
        height: "100%",
        tooltipFormat: "{{offset:offset}} - {{value}}",     
        tooltipValueLookups:
        {
            'offset': data.screens; 
        }
    });
});

円グラフは正常に作成されましたが、正しいラベルをオフセットに割り当てることができません。呼び出される JSON 文字列は次のとおりです。

{"screens":"{ 0: '1220x1080', 1: '1620x1080', 2: '1920x1080' }", "views":[2, 2, 61]}

オフセット(data.screens)にJSONの画面が挿入されるようにしたいです。次のようになります。

tooltipValueLookups:
{
    'offset': { 0: '1220x1080', 1: '1620x1080', 2: '1920x1080' }    
}

これはどのように達成できますか?

4

1 に答える 1

1

JSON 文字列:

{"screens":"{ 0: '1220x1080', 1: '1620x1080', 2: '1920x1080' }", "views":[2, 2, 61]}

"screens" は単一の文字列値であるため (つまり、"{ 0: '1220x1080', 1: '1620x1080', 2: '1920x1080' }" という値を持つ)、正しくありません。引用符を削除して、3 つの値のペアを持つオブジェクトにする必要があります。

{"screens": { "0": '1220x1080', "1": '1620x1080', "2": '1920x1080' }, "views":[2, 2, 61]}

この動作の例については、フィドルに入れた次のコードを参照してください。

var values = {"screens": { 0: '1220x1080', 1: '1620x1080', 2: '1920x1080' }, "views":[2, 2, 61]};

$('#test').sparkline(values.views,
                               {
                                   type: "pie",
                                   height: "100%",
                                   tooltipFormat: '{{offset:offset}}  - {{value}}',     
                                   tooltipValueLookups:
                                    {
                                        'offset': values.screens
                                    }
                               });
于 2013-10-28T02:02:46.910 に答える