Тёмный

Графики и диаграммы на PHP и JS 

Андрей Кудлай
Подписаться 4,6 тыс.
Просмотров 4,4 тыс.
50% 1

Одной из интересных задач при разработке интернет-магазина, к примеру, может быть задача, касающаяся аналитики данных. Для визуализации данной задачи принято строить графики и диаграммы. Показ результатов продаж за год с разбивкой по месяцам или же за несколько лет на диаграмме - буквально за секунды позволяет понять, сравнить и оценить ход продаж за выбранный период.
В уроке мы попробуем таким образом визуализировать данные в виде различных диаграмм на PHP и JS. Это будет классическая столбчатая диаграмма, а также линейная диаграмма (график) и круговая диаграмма.

Опубликовано:

 

10 апр 2022

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 32   
@Notconsol
@Notconsol Год назад
Вы единственный у кого я нашла ответ на свой вопрос.
@arturzakirov9167
@arturzakirov9167 2 года назад
Андрей, подскажи пожалуйста когда будет продолжение уроков парсинга? И еще вопрос: у тебя есть возможность и желание записать курс по symfony + создание сайта скажем доска объявлений или сайт аукцион или портал или хотя бы интернет магазин также с цифровыми товарами только уже на symfony?
@matroskin978
@matroskin978 2 года назад
Артур, желание есть, а вот возможности пока что нет, увы. Так сложились обстоятельства, что пока вынужден сделать перерыв. Поэтому пока что даже не смогу продолжить серию по парсингу. Но в будущем все возможно.
@arturzakirov9167
@arturzakirov9167 2 года назад
@@matroskin978 Желаю тебе скорее разрулить все твои обстоятельства и вернуться как можно быстрее к преподаванию. У тебя очень хорошо получается донести материал даже можно сказать разжевать любую сложную тему. В общем ждем от тебя новых видео!
@matroskin978
@matroskin978 2 года назад
@@arturzakirov9167 спасибо, Артур!
@daryasalauyova7460
@daryasalauyova7460 Год назад
Андрей, ваше видео помогло понять взаимодействие PHP и JS. Но у меня вопрос, на моем графике две диграммы из одной базы данных, и поскольку для шкалы времени некоторые данные отсутствуют и поскольку мы используем implode чтобы получить string, в моем случае эти данные ложатся на первые свободные даты, что не соответствует дествительности. А именно, вот у меня количество билетов по неделям. и например есть данные : 32 неделя - 5 новых билетов, 33я - нет, 34я - 4 новых билета. диграмма показывает : 32 - 5; 33 - 4; 34 - нет. Как быть ??
@matroskin978
@matroskin978 Год назад
Рад, что был полезен) Titanoboa в комментариях уже задавал подобный вопрос. Посмотрите - там эта проблема обсуждалась. Для корректного показа данных наборы должны иметь одинаковую длину. В Вашем случае, если данных нет за какую-то неделю, тогда для этой недели должно стоять значением ноль. В противном случае как раз и возникнет проблема, с которой Вы столкнулись.
@sparklemod2418
@sparklemod2418 7 месяцев назад
Здравствуйте! Подскажите, пожалуйста, что за плагин используется для верстки на 5:56 ? Который обернул container в тег div
@matroskin978
@matroskin978 7 месяцев назад
Здравствуйте! Это плагин Emmet - emmet.io/ Во многих редакторах он установлен по умолчанию и достаточно ввести точку и название класса, а затем нажать клавишу TAB, чтобы развернуть это в div с указанным классом.
@sparklemod2418
@sparklemod2418 7 месяцев назад
@@matroskin978 Благодарю за ответ! 💮
@arturzakirov9167
@arturzakirov9167 2 года назад
Андрей, офигенный урок! Спасибо огромное. Только подскажи пожалуйста что я должен делать чтобы самому писать код? Я смотрю твои курсы, видео, вроде все понимаю, но сам написать почти ничего не могу. В чем может быть проблема, над чем мне работать чтобы понимать это всё и самому писать код?
@matroskin978
@matroskin978 2 года назад
Пожалуйста) Для того, чтобы самому писать код - нужна практика. Здесь ведь как и с любой другой профессией в жизни: теория без практики - мертва. Когда мы осваиваем какую-либо профессию, то это не значит, что после получения этой профессии мы сразу становимся специалистами в ней. Нет. Для этого нужна практика. Мы начинаем пробовать применять полученные знания на практике. Начинаем с простого. Практически всегда допускаем какие-то ошибки. Но на ошибках учимся и приобретаем опыт. Только так. Поэтому и в написании кода - нужна практика. На примере текущей задачи ее можно разбить на подзадачи и решать каждую в отдельности. Для начала нам нужно было получить сырые данные из БД. Для этого достаточно было составить sql-запрос. Это первая подзадача. Далее нужно было привести сырые данные к нужному формату. Это вторая подзадача и ее можно было решить разными способами: готовой функцией PHP или же с использованием цикла. И так далее. То есть старайтесь пробовать разбивать задачу на подзадачи и решать каждую из них в отдельности. Начните с простых задач. Хорошей практикой я считаю задачу написания гостевой книги с авторизацией и регистрацией пользователей. Это не слишком сложная задача, но она затрагивает много различных возможностей. Попробуйте решить эту задачу самостоятельно.
@arturzakirov9167
@arturzakirov9167 2 года назад
@@matroskin978 спасибо за развернутый ответ и за потраченное на этот ответ время. Буду практиковаться
@dimassin4944
@dimassin4944 4 месяца назад
Здравствуйте, можно ли эти графики экспортировать в Excel? Я так понимаю, что это просто png картинки?
@matroskin978
@matroskin978 4 месяца назад
Здравствуйте! Так сходу не подскажу, задачи такой не было. Поэтому нужно смотреть, есть ли такая возможность у библиотеки.
@veronikaberg1411
@veronikaberg1411 Год назад
23:36 Вы сказали, что если будут строки, то нужно значения обернуть в кавычки. А как поступить, если там переменная?
@matroskin978
@matroskin978 Год назад
Так, как и сказал: пробежаться по каждому элементу строки, которая находится в переменной, и обернуть в кавычки. Например, есть такая строка: $labels = "янв, февр, март, апр, май, июнь, июль, авг, сент, окт, нояб, дек"; Получаем ее элементы в массив: $labels = explode(',', $labels); Пробегаемся в цикле по каждому элементу и оборачиваем элементы в кавычки: foreach ($labels as &$label) {$label = "'$label'";} Преобразуем массив в строку: $labels = implode(',', $labels); На выходе получаем такой вариант: "'янв',' февр',' март',' апр',' май',' июнь',' июль',' авг',' сент',' окт',' нояб',' дек'"
@veronikaberg1411
@veronikaberg1411 Год назад
​@@matroskin978 Благодарю за ответ. У меня, по итогу, получилось немного иначе: $implode_product_name_Array = "'".implode("','", $product_name_Array)."'";
@matroskin978
@matroskin978 Год назад
@@veronikaberg1411 если работает - тоже вариант)
@titanoboa9642
@titanoboa9642 Год назад
Здравствуйте, очень помогло ваще видео для построения графиков привязанных к одному id, можете подсказать как сделать, чтобы на графике можно было увидеть сравнение 2х объектов(с разными id)? Я пробовал поиграться с label, но при получении значений, если у 1 отсутствуют данные за определенных месяц, а у второго есть, lable первого не отображаются. А должно быть: у одного есть значение за определенный месяц, у второго нет, за другой месяц у них разные значения и т.д. и чтобы все отображалось.
@titanoboa9642
@titanoboa9642 Год назад
То есть как привязать значение data: [] к конкретному id
@matroskin978
@matroskin978 Год назад
Здравствуйте! Проверил у себя - вроде как нет такой проблемы, все работает, если в наборе данных отсутствуют какие-то значения, label не пропадает. Но в любом случае для корректного показа данных наборы должны иметь одинаковую длину. В противном случае, если данных нет за какой-то месяц, тогда как дать понять скрипту, что данных нет именно за этот месяц? Поэтому для сравнения наборы данных должны иметь одинаковую длину. Если данных за какой-то месяц нет, тогда просто установите ноль в качестве значения за этот месяц.
@titanoboa9642
@titanoboa9642 Год назад
@@matroskin978 Понял, спасибо. Простоя делаю для мусорной компании, и у них бывают случаи, что за какой то определенный месяц не увозили на полигон(1), а увозили на полигон(2). Отсюда и отсутствие в бд даты за месяц.
@matroskin978
@matroskin978 Год назад
@@titanoboa9642 пожалуйста ;)
@daryasalauyova7460
@daryasalauyova7460 Год назад
@@matroskin978 как установить 0 если данные берутся динамические а базе данные данной колонки нет, их отрабатывает функция ?
@fruit_stream
@fruit_stream Год назад
У меня почему то начинает ругаться "Uncaught Error: Call to a member function fetch() on array in". Пытаюсь построить график по заказам на wordpress.
@matroskin978
@matroskin978 Год назад
Если Вы используете WordPress, то fetch Вам не нужен. WP предлагает объект wpdb и набор методов, которые и вернут массив. Поэтому посмотрите документацию по этому объекту и работе с ним и получите данные в нужном формате. Например, использовав метод get_results(), который уже вернет массив. Не стесняйтесь распечатывать результат, чтобы убедиться, что получены данные в нужном формате.
@fruit_stream
@fruit_stream Год назад
@@matroskin978 в запросе get_results() я и использовал изначально.
@matroskin978
@matroskin978 Год назад
@@fruit_stream ну так я ведь и написал - зачем Вам тогда fetch? Я использовал fetch(), чтобы получить массив из результатов запроса. А get_results() уже возвращает массив, поэтому fetch() и не нужен. Об этом и в ошибке написали, что fetch() Вы вызвали для массива. Поэтому Вам остается только распечатать полученный массив и либо привести его к нужному формату, либо работать дальше с учетом имеющегося формата.
@fruit_stream
@fruit_stream Год назад
@@matroskin978 решил вопрос, спасибо.
@matroskin978
@matroskin978 Год назад
@@fruit_stream пожалуйста)
Далее
1❤️
00:20
Просмотров 25 млн
ТУРНИР ЧАКА 2024 - ПЛЕЙ ОФФ - День 2
5:18:26
1❤️
00:20
Просмотров 25 млн