0

jQuery(またはハイチャート)を使用して、以下の関数にデータを追加しようとしています。問題は、すべてのコードを文字列として記述する必要があるため、eval を使用せずにデータを JavaScript コードに埋め込む方法です。

function pie(data)
{
  $(function () {
    $('#renderingdiv').highcharts({
        chart: {
            plotBackgroundColor: null,
            plotBorderWidth: null,
            plotShadow: false
        },
        title: {
            text: 'Browser market shares at a specific website, 2010'
        },
        tooltip: {
            pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
        },
        plotOptions: {
            pie: {
                allowPointSelect: true,
                cursor: 'pointer',
                dataLabels: {
                    enabled: true,
                    color: '#000000',
                    connectorColor: '#000000',
                    format: '<b>{point.name}</b>: {point.percentage:.1f} %'
                }
            }
        },
        series: [**data**]
    });
});
};

データは次のようになります。

{\
            type: 'pie',\
            name: 'Statuses',\
            data: [\
                [WSCH,   377]\
        ,\
                [WMATL,   4]\
        ,\
                [WAPPR,   349]\
        ,\
                [NCOMP,   3]\
        ,\
                [INPRG,   56]\
        ,\
                [COMP,   18]\
        ,\
                [CLOSE,   697]\
        ,\
                [APPR,   420]\
        \
            ]\
        }

何かアイデアはありますか?

4

1 に答える 1

1

この簡単で汚れた関数は、データを有効な JSON に変換し、オブジェクトを返します。

function parseData(data) {    
    data = data
        // remove \+line endings
        .replace(/\[\n\r]+/g, '') 
        // insert double quotes for keys
        .replace(/([\[{,])\s*(\w+)([,:])/g, '$1"$2"$3') 
        // replace values single quotes with double
        .replace(/(:)\s*'(\w+)\s*'/g, '$1"$2"'); 
    return JSON.parse(data);
}

もちろん、コーナーケースを処理するためにこれを改善する必要があります。

DEMO: http://jsfiddle.net/qq98D/2/ (コンソール出力の結果)

しかし、これは単なる回避策です。本当の解決策は、有効な JSON を返すようにサーバー出力を変更することです。

結果(JSON エンコード):

{"type":"pie","name":"Statuses","data":[["WSCH",377],["WMATL",4],["WAPPR",349],["NCOMP" ,3],["INPRG",56],["COMP",18],["CLOSE",697],["APPR",420]]}

于 2013-09-04T23:57:59.870 に答える