Систематизация всех ресурсов по дизайну больших экранов в интернете, включая различные виды умных больших экранов, прототипы Axure с высоким разрешением, рекомендации по проектированию больших экранов и визуализацию изображений для проектирования больших экранов.

Внимание: впереди много энергии! Поскольку ресурсов довольно много, проект довольно большой, просим терпеливого ожидания клонированных коллег!

Поскольку содержимое будет постоянно обновляться, просим коллег, которые используют Fork, не забывать время от времени синхронизировать репозиторий!

Приглашаем всех коллег поделиться своими собственными прототипами, чтобы вместе создать идеальный справочный репозиторий для дизайна больших экранов!

Также рекомендуем другой наш репозиторий, посвящённый умным городам. Он содержит примеры кейсов, решения, анализ потребностей и систематизацию потребностей, связанных с умными городами, умными транспортными системами, умными автобусами, умными дорогами, умным государственным управлением, умными школами, координацией между автомобилями и дорогами, умными сообществами и т. д. Приглашаем всех друзей ознакомиться с ним при необходимости!

Визуализированный репозиторий больших экранов: https://gitee.com/AiShiYuShiJiePingXing/bigscreen

Репозиторий умных городов: https://gitee.com/AiShiYuShiJiePingXing/smart-city

Клонирование репозитория больших экранов: git clone https://gitee.com/AiShiYuShiJiePingXing/bigscreen.git

Клонирование репозитория умных городов: git clone https://gitee.com/AiShiYuShiJiePingXing/smart-city.git

1. Ресурсы для дизайна больших экранов

1.1 Изображения с эффектами для больших экранов

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

Содержание включает, но не ограничивается:

2. Собранные лично изображения экранов-лепестков

Адрес: https://huaban.com/boards/37969129/

Адрес: https://huaban.com/boards/71659253/

3. Некоторые выдающиеся примеры дизайна больших экранов

3.1 HTML для больших экранов

Адрес: http://yuanbaoshuju.com/preview.html

3.2 Шаблон панели мониторинга DataGear

Gitee адрес: DataGearDashboardTemplate

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

DataGear — это платформа для визуализации данных, разработанная на Java. Она использует архитектуру браузера/сервера, поддерживает SQL, CSV, Excel, HTTP API, JSON и другие источники данных. Основные функции включают управление данными, рабочую среду SQL, импорт/экспорт данных, управление наборами данных, управление диаграммами и управление панелями мониторинга.

Веб-сайт:

http://www.datagear.tech

Исходный код:

https://gitee.com/datagear/datagear

https://github.com/datageartech/datagear

3.3 Проект с шаблонами для ссылок

Lang/Большой экран для демонстрации данных

3.4 Комплексная система мониторинга для специального оборудования

Данные для визуализации экрана — комплексная система мониторинга для специального оборудования, контейнер под давлением. https://blog.csdn.net/yue31313/article/details/90813821

1. Интеграция с географической информационной системой (GIS) Google Maps. Отображение значков и всплывающих окон при нажатии. Изменение фона карты. Переключатель улиц. Флажки для фильтрации и переключения типов отображения.

2. Диаграммы Echarts. Карты. Статистические диаграммы.

3. Преобразование данных в диаграммы, оптимизация логики кода для повышения эффективности разработки диаграмм данных.

Скачать исходный код:

https://gitee.com/han_meng_fei_sha/TeZhongSheBeiZongHeJianGuanDaPing/tree/master

3.5 Платформа электронной коммерции с визуализацией данных

Платформа электронной коммерции Echarts с визуализацией данных — полный стек проектов для практики (с исходным кодом): https://juejin.cn/post/6960125126008389669

• Платформа электронной коммерции

Vue полный набор инструментов, WebSocket для передачи данных между передним и задним концом, задний конец Koa2, новые компоненты диаграммы Echarts (линейные диаграммы, гистограммы, круговые диаграммы, карты, точечные диаграммы), также поддерживают переключение тем, демонстрируют потрясающие эффекты диаграмм, также поддерживают переключение больших и малых экранов, обеспечивают эффект отображения диаграмм на разных экранах.

Онлайн-демонстрация: http://106.55.168.13:8999/screen

3.6 AJ-Report — инструмент для перетаскивания диаграмм

Gitee адрес: https://gitee.com/anji-plus/report

Онлайн опыт: https://report.anji-plus.com/index.html учетная запись: гость пароль: гость

Документация онлайн: https://report.anji-plus.com/report-doc/

AJ-Report для больших экранов — это инструмент для визуального перетаскивания и редактирования, интуитивно понятный, потрясающий и имеющий технологичный вид, полностью открытый исходный проект. Встроенные базовые функции включают источники данных, наборы данных и управление отчётами.

3.7 Визуализация данных на больших экранах с помощью Vue

— Визуализация данных на больших экранах с помощью Vue — Gitee адрес: https://gitee.com/zhufei_yao/study_hard

Описание проекта:

— проект, основанный на Vue, datav и Echart, «проект визуализации больших данных», использующий компонент Vue для динамического обновления и рендеринга данных, внутренние диаграммы могут быть свободно заменены. Часть диаграмм использует собственные компоненты DataV, которые можно изменить. Пожалуйста, нажмите ниже, чтобы узнать больше о документации DataV.

Демонстрация проекта:

3.8 data_view_web

— data_view_web — Gitee адрес: https://gitee.com/1967988842/data_view_web — Github адрес: https://github.com/ggymm/data-view-web

3.8.1 Платформа для визуализации данных

Введение переднего плана:

— диаграммы основаны на echarts4

— UI часть основана на element-ui

3.9 EC-Platform-Monitor

Github адрес: https://github.com/jackchen0120/EC-Platform-Monitor

Новый проект по продвинутому практическому применению системы мониторинга данных для электронной коммерции на основе Vue, WebSocket, Koa2 и новых компонентов Echarts (включая линейные диаграммы, столбчатые диаграммы, круговые диаграммы, географические карты и точечные диаграммы). Система поддерживает переключение тем оформления и предоставляет впечатляющие визуальные эффекты диаграмм, а также обеспечивает совместимость с большими и малыми экранами, обеспечивая согласованность отображения диаграмм на разных устройствах.

Онлайн-демонстрация: http://106.55.168.13:8999/

4. Визуализация ресурсов и веб-сайтов

4.1 AntV — платформа для визуализации больших данных от Alibaba

https://antv.gitee.io/zh

4.2 Mapbox — инструмент для разработки картографических приложений с открытым исходным кодом

https://www.mapbox.com/

4.3 2D/3D инструменты визуализации

• Maptalks — 2D/3D инструмент визуализации: https://maptalks.org/
• D3.js — библиотека для создания интерактивных визуализаций: https://d3js.org/
• Three.js — трёхмерный движок для создания и отображения 3D-графики: https://threejs.org/

4.4 Открытые библиотеки диаграмм

• Echarts — библиотека диаграмм для JavaScript: https://www.echartsjs.com/zh/index.html
• HighCharts — библиотека графиков и диаграмм: https://www.highcharts.com.cn/
• Kepler — пространственная библиотека диаграмм: https://kepler.gl/

4.5 Веб-3D городская визуализация

• https://zhuanlan.zhihu.com/p/55457466
• https://zhuanlan.zhihu.com/p/61871753

4.6 Интеграция Maptalks и Three.js

• GitHub: https://github.com/maptalks/maptalks.three
• Демонстрация: https://maptalks.org/maptalks.three/demo/index.html

4.7 Специализированные колонки о пространственном анализе и визуализации на Zhihu

• Geospatial and GIS: https://zhuanlan.zhihu.com/gagogl
• Пространственная визуализация больших данных: https://zhuanlan.zhihu.com/timespacedatav
• AntV: https://zhuanlan.zhihu.com/aiux-antv
• GIS之家: https://zhuanlan.zhihu.com/gishome
• Визуализация, которая выглядит не так мощно, как кажется: https://zhuanlan.zhihu.com/rendering-fantasy
• Изучение Cesium:
  • Cesium разработка и заметки: https://zhuanlan.zhihu.com/Cesium2
  • Cesium ресурсы: https://zhuanlan.zhihu.com/p/34217817?utm_source=wechat_session&utm_medium=social&s_r=0
• WebGL девять уровней глубины: https://zhuanlan.zhihu.com/webgllover
• Дизайн плоской сцены: https://zhuanlan.zhihu.com/c_1101177979924811776

4.8 Инструменты визуализации на основе программного обеспечения

• Tableau — платная программа для анализа данных и создания визуализаций. Поддерживает большие объёмы данных и более продвинутые формы представления. В основном используется для бизнес-анализа, с меньшим акцентом на географический анализ.
• Power BI — бесплатная программа для бизнес-аналитики. Похожа на Tableau, но доступна бесплатно. Используется для анализа данных и обмена информацией.
• Microsoft Power Map for Excel — плагин для создания карт в Excel.
• ArcScene — инструмент трёхмерной визуализации в ArcGIS.
• QGIS — бесплатная альтернатива ArcMap с более разнообразными возможностями визуализации. Позволяет накладывать и изменять цвета слоёв, создавая трёхмерные эффекты.
• Cartogram — плагин для ArcMap, который позволяет создавать деформированные карты, где размер региона зависит от другого показателя, кроме площади.
• Carto — онлайн-платформа для визуализации данных, аналогичная платформе QGIS. Отличается возможностью отображения данных во времени и созданием динамических графиков.
• Mapbox — фокусируется на настройке карт.

5. Инструменты для создания больших экранов визуализации

5.1 Datart — новое поколение платформ для открытой визуализации данных

Официальный сайт: https://running-elephant.github.io/datart-docs/

Datart — это новая платформа для открытой визуализации данных, поддерживающая создание отчётов, информационных панелей, больших экранов, анализ и визуализацию данных. Создана командой оригинальных разработчиков Davinci и предлагает большую открытость, гибкость и интеллектуальность.

Философия дизайна:

• Открытость: BI-продукты достигли высокого уровня зрелости, но большинство из них являются закрытыми системами, ограничивая пользователей данными, графиками и элементами визуализации, предоставляемыми внутри продукта. Datart стремится создать стандартизированную систему платформы для визуализации данных с открытыми и расширяемыми возможностями.
• Интегрируемость: Datart может использоваться как самостоятельная платформа, но также легко интегрируется с другими системами для быстрого создания специализированных систем данных.
• Интеллектуальность: помимо традиционной аналитики данных, Datart предлагает расширенные возможности анализа, позволяя пользователям получать ответы на вопросы «почему» в дополнение к «что».

Особенности:

Демонстрация:

http://datart-demo.retech.cc

Имя пользователя: demo

Пароль: 123456 Данные ссылки не содержат текста на русском языке.

Если вам требуется перевод каких-либо фрагментов кода или документации, пожалуйста, уточните запрос.