Ответ Json как поиск значения всплывающей подсказки для графика спарклайнов jquery

0

Я пытаюсь использовать ответ JSON в качестве параметра tooltipValueLookups в Sparklines графы, но безуспешно. Всплывающая подсказка просто показывает 0: 5 и 1: 8 вместо Малдера: 5 и Скалли: 8

Он отлично работает, если я просто объявляю переменные агенты с точно таким же json:

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

Но evrything идет на юг, когда я пытаюсь сделать это с ответом сервера, как и предполагалось. Может ли кто-нибудь сказать мне, пожалуйста, что я делаю неправильно?

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

Ответ: {"names": {"0": "Малдер", "1": "Скалли"}}

$("#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'});

Заранее спасибо.

РЕДАКТИРОВАТЬ

После много кофе и ругательств я наконец получил его на работу. Должен признаться, не очень изящное решение.

Во-первых, мне пришлось изменить серверную php-функцию, чтобы вернуть строку, а не json.

Затем в вызове 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: Спасибо за вашу помощь, это было очень полезно.

Теги:
sparklines

1 ответ

1

Фильтр json с $.grep

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

И используйте в своей функции:

tooltipValueLookups:{offset: filteredNames}

Здесь вы можете увидеть демо: jsfiddle

Примечание. Если вы возвращаете строку с сервера, вам необходимо использовать;

var agents = jQuery.parseJSON(response);
  • 0
    Извините, это не работает. Я не могу переопределить JSON, это ответ от сервера. Кроме того, я почти уверен, что опция tooltipValueLookups должна иметь ключи. Как я уже сказал, функция работает как шарм, если я непосредственно объявляю объект JSON. Когда я пытаюсь использовать ответ, все идет не так, как ожидалось. Спасибо, в любом случае :)
  • 0
    @ Сэм, ладно, Джсон может остаться таким же. Я обновил свой код и демо, см. Мой обновленный asnwer.
Показать ещё 3 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню