Как сделать диаграмму?
Подскажите как сделать такую диаграмму(если это вообще диаграмма)
. Что-бы можно было управлять значениями через html или js. Не могу даже понять с чего начать ее построение. Спасибо
Дополнительно:
Вычисляй относительную длину шкалы, твой синенький div будет примерно таким:
.statusbar { height: 15px; border-radius: 15px; background-color: blue; } |
.statusbar { height: 15px; border-radius: 15px; background-color: blue; }
Вычисленную относительную длину каждого бара вбивай в инлайновый стиль (все способы подсказывать тут не вижу смысла):
<div class="statusbar" style="width=15%"></div> <div class="statusbar" style="width=65%"></div> <div class="statusbar" style="width=98%"></div> ... <div class="statusbar" style="width=5%"></div> |
<div class="statusbar" style="width=15%"></div> <div class="statusbar" style="width=65%"></div> <div class="statusbar" style="width=98%"></div> ... <div class="statusbar" style="width=5%"></div>
Дальше как фантазия подскажет. Я только направление подсказал
Ответы:
https://www.chartjs.org/docs/latest/charts/bar.htm...
Вариант с хорошей документацией, легкий в применении. Вариантов других диаграмм также масса.
Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.
Пока нет других ответов. Будьте первым, кто поможет автору.
Ответить на вопрос
Для создания диаграммы можно воспользоваться различными инструментами и сервисами. Один из самых популярных способов - использовать специализированные программы для создания диаграмм, такие как Microsoft Visio, Lucidchart, Draw.io и др.
Если вы предпочитаете создавать диаграммы онлайн, то сервис Draw.io является отличным выбором. Для начала работы с Draw.io необходимо перейти на их сайт и выбрать тип диаграммы, которую вы хотите создать (например, диаграмма потоков данных, UML-диаграмма, диаграмма классов и т.д.).
После выбора типа диаграммы, вы можете начать добавлять элементы на холст, связывать их стрелками, изменять их стили и т.д. Draw.io предоставляет широкий набор инструментов для создания профессиональных диаграмм любой сложности.
Кроме того, для создания диаграмм можно использовать специализированные библиотеки и инструменты программирования. Например, при работе с языком программирования PHP вы можете воспользоваться библиотеками для создания диаграмм, такими как PlantUML, Graphviz и др. Эти инструменты позволяют создавать диаграммы прямо из кода, что может быть удобным при автоматизации процесса создания диаграмм.
Пример создания диаграммы с использованием PHP и библиотеки PlantUML:
getPlantUMLImage($diagramCode); // Вывод изображения на экран echo '<img src="' . $imagePath . '" alt="Диаграмма">';
Это лишь один из способов создания диаграмм с использованием PHP. Надеюсь, данная информация будет полезной для вас. Если у вас возникнут дополнительные вопросы, не стесняйтесь задавать их.