Вывод данных из JSON

@PeterLS · Регистрация: 24.11.2012

Студворк — интернет-сервис помощи студентам

Здравствуйте, уважаемые форумчане!
Суть дела такая: нужно заполнить массив данными из файла JSON. Я уже часа четыре с этим делом е*усь, прочитал кучу статей, но все равно никак не могу разобраться - ну не мое это JS!
Вообщем, этот кусок кода у нас выводит график на сайте:

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
Morris.Line({
        element: 'morris-area-chart',
        data: [
        {
            period: '2015-04-01',
            zah: 6
        },{
            period: '2015-04-02',
            zah: 9
        },{
            period: '2015-04-03',
            zah: 9
        },{
            period: '2015-04-04',
            zah: 17
        },{
            period: '2015-04-05',
            zah: 9
        },{
            period: '2015-04-06',
            zah: 9
        },{
            period: '2015-04-07',
            zah: 9
        },{
            period: '2015-04-08',
            zah: 1
        }],
        xkey: 'period',
        ykeys: ['zah'],
        labels: ['Посетителей'],
        pointSize: 3,
        hideHover: 'auto',
        resize: true
        
    });

а мне вместо

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
data: [
        {
            period: '2015-04-01',
            zah: 6
        },{
            period: '2015-04-02',
            zah: 9
        },{
            period: '2015-04-03',
            zah: 9
        },{
            period: '2015-04-04',
            zah: 17
        },{
            period: '2015-04-05',
            zah: 9
        },{
            period: '2015-04-06',
            zah: 9
        },{
            period: '2015-04-07',
            zah: 9
        },{
            period: '2015-04-08',
            zah: 1
        }]

нужно вывести данные отсюда:
http://api-metrika.yandex.ru/s... 8&pretty=1
причем нужно вывести только поля date, visits и visitors. Помогите пожалуйста сообразить!

Добавлено через 1 час 25 минут
Хотя бы примерно объясните как это сделать, дайте ссылку на похожие примеры.

@Lazy_Den · 08.04.2015, 09:35

Сообщение от PeterLS

причем нужно вывести только поля date, visits и visitors

Вывести или сформировать объект с этими данными, как в примере выше? Смотрите такой вариант.

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
var data = [];
$.ajax({
    url: 'http://api-metrika.yandex.ru/stat/traffic/summary.json?id=2138128&pretty=1',
    type: 'POST',
    dataType: 'jsonp',
    success: function (json) {
        $.each(json.data, function (i, el) {
            data.push({
                date: el.date,
                visits: el.visits,
                visitors: el.visitors
            });
        });
        // data - содержит необходимые элементы
    }
});

@PeterLS · 08.04.2015, 14:10 **[ТС]**

Что-то все-равно не работает у меня... Что я неправильно делаю?

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
var vizits = [];
$.ajax({
    url: 'http://api-metrika.yandex.ru/stat/traffic/summary.json?id=2138128&pretty=1',
    type: 'POST',
    dataType: 'jsonp',
    success: function (json) {
        $.each(json.vizits, function (i, el) {
            vizits.push({
                date: el.date,
                visits: el.visits,
                visitors: el.visitors
            });
        });
    }
});
$(function() {
    Morris.Line({
        element: 'morris-area-chart',
        data: vizits,
        xkey: 'date',
        ykeys: ['visits', 'visitors'],
        labels: ['Посетителей', 'Просмотров'],
        pointSize: 3,
        hideHover: 'auto',
        resize: true
        
    });
});

@Lazy_Den · 08.04.2015, 16:35

Сообщение от PeterLS

Что я неправильно делаю?

Не учитываете асинхронность. Плагин у вас инициализируется до того, как ajax-запрос завершится. Пробуйте так:

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
function getLineData() {
    return new Promise(function (resolve, reject) {
        $.ajax({
            url: 'http://api-metrika.yandex.ru/stat/traffic/summary.json?id=2138128&pretty=1',
            type: 'POST',
            dataType: 'jsonp',
            error: reject,
            success: function (json) {
                var vizits = [];
                $.each(json.data, function (i, el) {
                    vizits.push({
                        date: el.date,
                        visits: el.visits,
                        visitors: el.visitors
                    });
                });
                return resolve(vizits);
            }
        });
    });
}
$(function () {
    getLineData().then(function (vizits) {
        Morris.Line({
            element: 'morris-area-chart',
            data: vizits,
            xkey: 'date',
            ykeys: ['visits', 'visitors'],
            labels: ['Посетителей', 'Просмотров'],
            pointSize: 3,
            hideHover: 'auto',
            resize: true
 
        });
    }, function (error) {
        // Хьюстон! У нас проблемы!
        console.log('Failed!: ' + error.statusText);
    });
});

@PeterLS · 08.04.2015, 18:49 **[ТС]**

Нет, все равно не работает. Какие-то данные считываются неправильно видимо...

@Lazy_Den · 08.04.2015, 19:09

Сообщение от PeterLS

Нет, все равно не работает.

Ошибки в консоли какие-то есть?

Добавлено через 14 минут
UPD Я понял в чем проблема. Дата приходит не в том формате, который требуется.

JavaScript
1
2
3
4
// Заменяем строку
date: el.date,
// на эту
date: (el.date).replace(/(\d{4})(\d{2})(\d{2})/,'$1-$2-$3'),

Проверяем результат

@PeterLS · 08.04.2015, 20:26 **[ТС]**

Спасибо огромное за помощь! Все работает! :-)

Новые блоги и статьи Все статьи Все блоги /
Советы по крайней бережливости. Внимание, это ОЧЕНЬ длинный пост. Programma_Boinc 28.12.2025 Советы по крайней бережливости. Внимание, это ОЧЕНЬ длинный пост. Налог на собак: https:/ / ********/ gallery/ V06K53e Финансовый отчет в Excel: https:/ / ********/ gallery/ bKBkQFf Пост отсюда. . .	Кто-нибудь знает, где можно бесплатно получить настольный компьютер или ноутбук? США. Programma_Boinc 26.12.2025 Нашел на реддите интересную статью под названием Anyone know where to get a free Desktop or Laptop? Ниже её машинный перевод. После долгих разбирательств я наконец-то вернула себе. . .	Thinkpad X220 Tablet — это лучший бюджетный ноутбук для учёбы, точка. Programma_Boinc 23.12.2025 Рецензия / Мнение/ Перевод Нашел на реддите интересную статью под названием The Thinkpad X220 Tablet is the best budget school laptop period . Ниже её машинный перевод. Thinkpad X220 Tablet —. . .	PhpStorm 2025.3: WSL Terminal всегда стартует в ~ and_y87 14.12.2025 PhpStorm 2025. 3: WSL Terminal всегда стартует в ~ (home), игнорируя директорию проекта Симптом: После обновления до PhpStorm 2025. 3 встроенный терминал WSL открывается в домашней директории. . .	Как объединить две одинаковые БД Access с разными данными VikBal 11.12.2025 Помогите пожалуйста !! Как объединить 2 одинаковые БД Access с разными данными.
Новый ноутбук volvo 07.12.2025 Всем привет. По скидке в "черную пятницу" взял себе новый ноутбук Lenovo ThinkBook 16 G7 на Амазоне: Ryzen 5 7533HS 64 Gb DDR5 1Tb NVMe 16" Full HD Display Win11 Pro	Музыка, написанная Искусственным Интеллектом volvo 04.12.2025 Всем привет. Некоторое время назад меня заинтересовало, что уже умеет ИИ в плане написания музыки для песен, и, собственно, исполнения этих самых песен. Стихов у нас много, уже вышли 4 книги, еще 3. . .	От async/await к виртуальным потокам в Python IndentationError 23.11.2025 Армин Ронахер поставил под сомнение async/ await. Создатель Flask заявляет: цветные функции - провал, виртуальные потоки - решение. Не threading-динозавры, а новое поколение лёгких потоков. Откат?. . .	Поиск "дружественных имён" СОМ портов Argus19 22.11.2025 Поиск "дружественных имён" СОМ портов На странице: https:/ / norseev. ru/ 2018/ 01/ 04/ comportlist_windows/ нашёл схожую тему. Там приведён код на С++, который показывает только имена СОМ портов, типа,. . .	Сколько Государство потратило денег на меня, обеспечивая инсулином. Programma_Boinc 20.11.2025 Сколько Государство потратило денег на меня, обеспечивая инсулином. Вот решила сделать интересный приблизительный подсчет, сколько государство потратило на меня денег на покупку инсулинов. . . .

@PeterLS 71 / 69 / 22 Регистрация: 24.11.2012 Сообщений: 502 Записей в блоге: 1
	08.04.2015, 18:49 [ТС]
	Нет, все равно не работает. Какие-то данные считываются неправильно видимо... 0

@PeterLS 71 / 69 / 22 Регистрация: 24.11.2012 Сообщений: 502 Записей в блоге: 1
	08.04.2015, 20:26 [ТС]
	Спасибо огромное за помощь! Все работает! :-) 0

Вывод данных из JSON

Решение