Как построить два графика в одном с разным количеством точек оси X Chart.js

@Николай93 · Регистрация: 23.10.2010

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

Здравствуйте.
Нужно совместить два графика в одном. Вся соль в том, что эти графики разные. Первый несёт в себе данные за 12 часов - точка в час, а второй данные за каждые 5 минут точка за 12 часов.
Другими словами у первого графика 12 точек, а у второго 144 точки(12 часов по 12 пятиминуток в час.

Можно ли как то это совместить ? Один график часовой должен быть столбчатый, а другой линейный.
Использую библиотеку Chart js

Знаю, что графикам нужно одно общее основание.
Гуглил, но ничего не нашёл подходящего.

Заранее спасибо за любой совет.

@Splaisto · 21.11.2023, 13:23

так можно же те, что раз в час, размапить на 5минутки с null'ами

@Николай93 · 21.11.2023, 13:29 **[ТС]**

Наверное можно, но тут же другой вопрос встаёт. Как потом столбики совместить друг с другом, что бы столбчатая диаграмма получилась ? На массштабе 144 точки 12 часовые столбики получаются очень тонкими. Если получится решить эту проблему, то можно сказать я нашёл ответ на вопрос )

@Splaisto · 21.11.2023, 16:37

Сообщение от Николай93

Как потом столбики совместить друг с другом,

так это же...

Сообщение от Николай93

Один график часовой должен быть столбчатый, а другой линейный

и в целом сомнительное отображение стакнутых баров для разных периодов. оно точно надо?

@Николай93 · 21.11.2023, 20:29 **[ТС]**

Я полностью согласен с вами. Дело в том, что этого требует мой начальник на работе. Я уже всеми правдами и неправдами доказываю, что это дичь, но меня не слышат. Делай и всё. Вот и топчусь на месте уже около недели...

@mr_dramm · 21.11.2023, 20:50

Графики оба отражают интервал 12 часов, временная шкала будет одна, крорее всего горизонтальная
Данные, если это одни и теже данные, то тоже великолепно, это вертикальная шкала, если разные просто отмасштабируй чтобы было красиво.

Вариант 1. Сделай два линейных графика только с линиями разных цветов.

Вариант 2. Столбчатые тоже неплохо для данных 1 раз в час, особенно если получается что столбчатые стоятся по пику 5 минутных линейных, тогда пик линейного графика будет упираться в пик столбчатого. Получится 12 графиков на одном графике как будто

Сообщение от Николай93

Вот и топчусь на месте уже около недели...

Если это на зарплате не отражается то хоть месяц, станешь потом руководителем отдела составления графиков =)

@Николай93 · 21.11.2023, 20:59 **[ТС]**

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

Вариант 1. Сделай два линейных графика только с линиями разных цветов.
Вариант 2. Столбчатые тоже неплохо для данных 1 раз в час, особенно если получается что столбчатые стоятся по пику 5 минутных линейных, тогда пик линейного графика будет упираться в пик столбчатого.

1: Требует именно столбчатый (для часовых интервало) и линейный (для 5 минутных интервалов). Так бы я уже давно решил задачу. Хорошая идея, но нельзя (
2: Да, но я до сих пор не пойму как смасшатибровать... К тому же недостаточно хорошо знаю эту либу. Если просто построить столбики, то они, на масштабе 5 минутных интервалов, будут очень худые. Как забуфить объект массива с точками для масштабирования я примерно понимаю, а как толщину столбиков в либе увеличить не знаю.
Такие делаю (

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

Если это на зарплате не отражается то хоть месяц, станешь потом руководителем отдела составления графиков =)

К сожалению на зарплате ))

@mr_dramm · 21.11.2023, 21:05

Сообщение от Николай93

2: Да, но я до сих пор не пойму как смасшатибровать... К тому же недостаточно хорошо знаю эту либу. Если просто построить столбики, то они, на масштабе 5 минутных интервалов, будут очень худые. Как забуфить объект массива с точками для масштабирования я примерно понимаю, а как толщину столбиков в либе увеличить не знаю.
Такие делаю (

Я тоже с этой либой не работал, но первойе что приходит в голову это найти максимумы в пяти минутных графиках по каждому часу, и найти соотношение с максимумами 12 часового, и просто 12 часовоые данные домножить разделить на это число. Чтобы они выровнялись по вертикми плюс минус

Новые блоги и статьи Все статьи Все блоги /
Программный контроль заполнения реквизита табличной части документа Maks 02.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: реализовать контроль заполнения реквизита "ПричинаСписания". . .	wmic не является внутренней или внешней командой Maks 02.04.2026 Решение: DISM / Online / Add-Capability / CapabilityName:WMIC~~~~ Отсюда: https:/ / winitpro. ru/ index. php/ 2025/ 02/ 14/ komanda-wmic-ne-naydena/	Программная установка даты и запрет ее изменения Maks 02.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: при создании документов установить период списания автоматически. . .	Вывод данных в справочнике через динамический список Maks 01.04.2026 Реализация из решения ниже выполнена на примере нетипового справочника "Спецтехника" разработанного в конфигурации КА2. Задача: вывести данные из ТЧ нетипового документа. . .
Программное заполнения текстового поля в реквизите формы документа Maks 01.04.2026 Алгоритм из решения ниже реализован на нетиповом документе "ВыдачаОборудованияНаСпецтехнику" разработанного в конфигурации КА2, в дополнении к предыдущему решению. На форме документа создается. . .	К слову об оптимизации kumehtar 01.04.2026 Вспоминаю начало 2000-х, университет, когда я писал на Delphi. Тогда среди программистов на форумах активно обсуждали аккуратную работу с памятью: нужно было следить за переменными, вовремя. . .	Идея фильтра интернета (сервер = слой+фильтр). Hrethgir 31.03.2026 Суть идеи заключается в том, чтобы запустить свой сервер, о чём я если честно мечтал давно и давно приобрёл книгу как это сделать. Но не было причин его запускать. Очумелые учёные напечатали на. . .	Модель здравосоХранения 6. ESG-повестка и устойчивое развитие; углублённый анализ кадрового бренда anaschu 31.03.2026 В прикрепленном документе раздумья о том, как можно поменять модель в будущем

@Николай93 1 / 1 / 0 Регистрация: 23.10.2010 Сообщений: 32

	Как построить два графика в одном с разным количеством точек оси X Chart.js 21.11.2023, 12:05. Показов 1479. Ответов 7 Метки chart.js, java-script (Все метки) Здравствуйте. Нужно совместить два графика в одном. Вся соль в том, что эти графики разные. Первый несёт в себе данные за 12 часов - точка в час, а второй данные за каждые 5 минут точка за 12 часов. Другими словами у первого графика 12 точек, а у второго 144 точки(12 часов по 12 пятиминуток в час. Можно ли как то это совместить ? Один график часовой должен быть столбчатый, а другой линейный. Использую библиотеку Chart js Знаю, что графикам нужно одно общее основание. Гуглил, но ничего не нашёл подходящего. Заранее спасибо за любой совет. 0

@Splaisto 250 / 184 / 58 Регистрация: 12.03.2021 Сообщений: 1,043
	21.11.2023, 13:23
	так можно же те, что раз в час, размапить на 5минутки с null'ами 0

@Николай93 1 / 1 / 0 Регистрация: 23.10.2010 Сообщений: 32
	21.11.2023, 13:29 [ТС]
	Наверное можно, но тут же другой вопрос встаёт. Как потом столбики совместить друг с другом, что бы столбчатая диаграмма получилась ? На массштабе 144 точки 12 часовые столбики получаются очень тонкими. Если получится решить эту проблему, то можно сказать я нашёл ответ на вопрос ) 0

@Николай93 1 / 1 / 0 Регистрация: 23.10.2010 Сообщений: 32
	21.11.2023, 20:29 [ТС]
	Я полностью согласен с вами. Дело в том, что этого требует мой начальник на работе. Я уже всеми правдами и неправдами доказываю, что это дичь, но меня не слышат. Делай и всё. Вот и топчусь на месте уже около недели... 0