ДОСТУПНА НОВАЯ ВЕРСИЯ! Webix 11 Подробнее Обновления в Core, SpreadSheet, File Manager и Report Manager и многое другое

WEBIX JAVASCRIPT LIBRARY BLOG

Новости, релизы, помощь и советы по разработке web UI, новейшие тенденции и know-how практики по JavaScript программированию. Создавайте web интерфейсы быстрее и качественнее.

Подписывайтесь:

Пишите для нас: guest posts guidelines.

Интеграция со сторонними чартами

Ни для кого ни секрет, что чарт является удобным инструментом для систематизации информации и управления ей. Чарты способны представлять огромные объемы данных в простом схематичном виде. Библиотека Webix стремится следовать современным тенденциям и предлагает возможность интеграции с популярными чартами таких Javascript библиотек, как D3, Raphael and Sigma и JustGage. В то же время, у Webix есть коллекция собственных JavaScript графиков.

Инициализация чарта на странице

Вам не потребуется писать длинный код, чтобы добавить сторонний чарт в приложение Webix, поскольку компоненты Webix уже содержат все необходимое.

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

Этот специальный javascript файл подключит ваше приложение к выбранному чарту и автоматически загрузит все необходимые файлы чарта.

Интеграция с текстовыми онлайн-редакторами

Возможность размещения текстового онлайн-редактора на странице, без сомнения, нужная и полезная вещь. Библиотека Webix предлагает простое решение этой задачи, требующее лишь нескольких строк кода.
В настоящее время Webix поддерживает такие популярные редакторы, как Mercury, NicEdit, Tinymce, CodeMirror и CKEditor.

 Mercury TextEditor

Интеграция с географическими картами онлайн

При создании веб-страницы часто требуется добавить механизм поиска места на карте. Webix предлагает простое и элегантное решение для встраивания в веб-приложение географических карт онлайн.

Эта статья расскажет вам, как добавить популярные веб-карты, такие как Google, Nokia, OpenStreet и Yandex maps в приложение Webix, используя всего несколько строк кода.

Создание виджета карты

Прежде всего, из открытого репозитория вспомогательных компонентов Webix нужно загрузить специальный JavaScript файл, который поможет встроить карту в веб-приложение. Этот файл соединит ваше приложение со сторонними библиотеками и файлами, необходимыми для выбранной карты без непосредственного подключения к ним. Обратите внимание, что эти расширения не входят в стандартный пакет библиотеки.

После загрузки необходимого файла с JS кодом, нужно подключить ссылку на него в тег вашего документа. Например, чтобы встроить в веб-страницу карту Google Map, необходимо скачать файл “googlemap.js” и подключить его с помощью строки кода ниже:

<script type="text/javascript" src="./googlemap.js"></script>

google_map

Создание кастомного виджета — интеграция с HipChat

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

Стандартный пакет Webix уже включает в себя JS файлы для интеграции с такими популярными решениями как Google Maps, FCK Editor, D3 charts и множество других. Однако, это всего лишь капля в море. Каждый день появляются новые JS библиотеки, и невозможно обеспечить поддержку всех их “из коробки”. Вместо этого, Webix позволяет создавать новую интеграцию для любой сторонней библиотеки, используя всего несколько строк. Давайте посмотрим, как это осуществляется.

1 2