0

スパークライン グラフのtooltipValueLookupsパラメータとして json レスポンスを使用しようとしていますが、成功しません。ツールチップには、Mulder:5 と Scully:8 の代わりに 0:5 と 1:8 が表示され続けます。

変数エージェントをまったく同じ json で宣言するだけで、完全に機能します。

var agents = {"names":{"0":"Mulder", "1":"Scully"}}

しかし、意図したとおり、サーバーの応答でそれを実行しようとすると、すべてがうまくいきません。誰か教えてください、私は何が間違っていますか?

var agents = $.ajax({
    url     : "/ajaxAgents",
    type    : "get",
    dataType: 'json'
});

応答: {"names":{"0":"Mulder", "1":"Scully"}}

$("#mini-chart").sparkline([5,8], {
    type: 'bar',
    height: '30px',
    barWidth: 6,
    barSpacing: 2,
    barColor: '#0aa699',
    tooltipFormat: '<span style="color: {{color}}">&#9679;</span> {{offset:offset}}: {{value}}',
    tooltipValueLookups:{offset:agents.names},
    negBarColor: '#0aa699'});

前もって感謝します。

編集

たくさんのコーヒーとののしりの後、ようやく機能するようになりました。非常に洗練されたソリューションではないことは認めざるを得ません。

まず、 json ではなくstringを返すようにサーバー側の php 関数を変更する必要がありました。

次に、ajax 呼び出しで:

var response = $.ajax({
    url     : "/ajaxAgents",
    type    : "get",
    dataType: 'text',
    global  : false,
    async   : false,
    success : function(data){return data;}
}).responseText;

次に、応答を解析してフィルタリングします。

var agents = $.parseJSON(response);
var filteredNames = $.map(agents.names, function(el) {
        return el;
    });

そして最後に、スパークライン機能:

    $("#mini-chart").sparkline(agentsData, {
    type: 'bar',
    height: '30px',
    barWidth: 6,
    barSpacing: 2,
    barColor: '#0aa699',
    tooltipFormat: '<span style="color: {{color}}">&#9679;</span> {{offset:offset}}: {{value}}',
    tooltipValueLookups:{offset:filteredNames},
    negBarColor: '#0aa699'});

@Hüseyin: ご協力ありがとうございます。とても役に立ちました。

4

1 に答える 1