Привет! Изучал недавно красно-черные деревья. Попробовал визуализировать детали работы алгоритмов вставки и удаления на d3.js. Надеюсь, полученный результат поможет сэкономить немного времени тем, кто изучает алгоритмы на javascript. Посмотреть можно тут. Исходник реализации, от которой отталкивался тут . Под катом краткие подробности.
Читать полностью »
Рубрика «d3.js»
Красно-чёрные деревья на javascript
2020-02-23 в 10:11, admin, рубрики: d3.js, javascript, Алгоритмы, красно-черные деревья, Учебный процесс в IT10 лучших JavaScript библиотек для визуализации данных на графиках и диаграммах
2019-06-28 в 4:40, admin, рубрики: amcharts, anychart, big data, Business Intelligence, chart.js, charting, chartist.js, charts, D3, d3.js, data visualization, fusioncharts, Google, Google Charts, highcharts, html5, javascript, js charts, plotly, svg, zingchart, анализ данных, библиотека javascript, Большие данные, визуализация данных, графики, графики и диаграммы, данные, дашборд, диаграммы, Программирование, Разработка веб-сайтовЕсть в графиках что-то магическое. Изгиб кривой мгновенно раскрывает всю ситуацию — историю развития эпидемии, паники или периода процветания. Эта линия просвещает, пробуждает воображение, убеждает.
― Генри. Д. Хаббард
Объемы данных, с которыми нужно работать, постоянно увеличиваются. И чем больше информации, тем сложнее ее обрабатывать. Вот почему сейчас стала особенно популярна тема визуализации данных — в виде графиков, диаграмм, дашбордов, желательно интерактивных. Визуальное представление данных позволяет нам, людям, тратить меньше времени и сил на их просмотр, анализ и осмысление, а также на принятие правильных, информированных решений на основе этого.
Вряд ли кто-то станет отрицать, что в современном HTML5 вебе JavaScript — самая универсальная и простая технология для визуализации данных. Так что, если вы занимаетесь фронтенд-разработкой, то вы, скорее всего, либо уже имели дело с созданием JS чартов, либо столкнетесь с этим в (скором) будущем.
Существует множество JavaScript библиотек для построения графиков и диаграмм, каждая из которых (как и любые другие инструменты) имеет свои плюсы и минусы. Чтобы облегчить вам жизнь, я решил рассказать о тех из них, которые нравятся мне больше всего. Я считаю, десять следующих библиотек — это лучшие JS библиотеки для создания графиков, и они действительно способны помочь решить практически любую задачу по визуализации данных. Давайте вместе пройдемся по списку и убедимся, что они вам известны хотя бы базово и вы не упустили из виду какую-нибудь хорошую библиотеку, которая может оказаться полезной в текущих или будущих больших проектах.
Что ж, приступим: вот лучшие JS библиотеки для визуализации данных!Читать полностью »
Лучший Способ Программирования (Better way To Code)
2018-11-02 в 17:07, admin, рубрики: d3.js, javascript, observablehq, open source, Разработка веб-сайтов, Совершенный кодОт переводчика:
Я не являюсь ни профессиональным программистом ни профессиональным переводчиком, но появление описанного в статье инструмента от создателя популярной библиотеки D3.js
произвело на меня сильное впечатление.
С удивлением обнаружил, что на Хабре, да и вообще в русскоязычном интернете, более года несправедливо игнорируют данный инструмент. Поэтому решил, что просто обязан внести свой вклад в развитие искусства программирования, в JavaScript в частности.
Знакомьтесь, d3.express, интегрированная исследовательская среда.
(с 31 января 2018г d3.express зовется Observable и живет на beta.observablehq.com)
Если вам когда-либо приходилось тупить над своим кодом или разбираться в чужом, тогда вы не одиноки. Эта статья для вас.
Последние лет восемь я разрабатывал инструменты для визуализации информации. Самым удачным результатом моих усилий стала js-библиотека D3. Однако опасность столь долгой разработки инструментария в том, что ты забываешь зачем ты это делаешь: инструмент становится самоцелью, польза от его применения уходит на второй план.
Предназначение инструмента визуализации — построение визуализаций. Но в чем же цель визуализации? Слово Бену Шнейдерману(Per Ben Shneiderman):
«Результат визуализации — это Читать полностью »
Визуализация данных при помощи Angular и D3
2018-06-24 в 17:24, admin, рубрики: angular, angular2, angular5, D3, d3.js, data, datavisualization, javascript, TypeScript, visualizationD3.js — это JavaScript библотека для манипулирования документами на основе входных данных. Angular — фреймворк, который может похвастаться высокой производительностью привязки данных.
Ниже я рассмотрю один хороший подход по использованию всей этой мощи. От симуляций D3 до SVG-инъекций и использования синтаксиса шаблонизатора.
Демо: положительные числа до 300 соединенные со своими делителями.
Читать полностью »
Разработка для Sailfish OS: отображение графиков с использованием D3.js и QML Canvas
2018-05-22 в 10:17, admin, рубрики: d3.js, QML, qt, sailfish os, разработка мобильных приложений, Разработка под Sailfish OSЗдравствуйте! Данная статья является продолжением цикла статей, посвященных разработке приложений для мобильной платформы Sailfish OS. На этот раз речь пойдет о работе с графиками в Sailfish-приложении. Мы расскажем о поиске и подключении библиотеки и о том, как мы отображаем графики математических функций. Отметим, что предложенное решение не ограничивается платформой Saiflsh OS и в целом подходит для любого QtQuick приложения.
Читать полностью »
Просто о D3.js
2017-11-10 в 11:03, admin, рубрики: d3.js, javascript, svg, векторная графика, визуализация, визуализация данных, Инфографика, Работа с векторной графикойКарта артистов, неуклюжий поиск связей в данных и как можно изобрести велосипед
2017-05-24 в 4:16, admin, рубрики: collaborative filtering, d3.js, data mining, data science, javascript, JS, артисты, визуализация данных, группы, музыкальные данные, открытые данные, метки: группы, музыкальные данныеНедавно смотрел серию видео популяризатора математики. Там он пытается рассказывать про математический анализ и линейную алгебру немного с позиции человека, который «как бы» изобрел бы ее с нуля. То есть пытается делать доступными простые и понятые визуализации относительно сложных концепций, как бы объясняя их с позиции человека, который как будто бы придумал это впервые. Относительно недавно читал статью на Хабре про unsupervised learning и увидел там раздел про Affinity Propagation. Как оказалось, мы использовали именно этот метод кластерного анализа чисто интуитивно, сами того не ведая.
TLDR для данной статьи. Если хотите интерактивную визуализацию, проследуйте сюда.
В данной визуализации в виде графа показаны связи между музыкальными жанрами ~25,000 самых популярных артистов мира, причем размер кругляшка показывает популярность данного жанра, а размер ребра графа — силу связи.
8 JavaScript библиотек для визуализации данных в виде интерактивных карт
2016-12-27 в 15:09, admin, рубрики: amcharts, ammap, anychart, anymap, big data, charting, D3, d3.js, Google Charts, highcharts, highmaps, javascript, jvectormap, kartograph, kartograph.js, mapael, svg, визуализация данных, интерактивная карта, картограммаВизуализация данных стала неотъемлемой частью жизни практически каждого веб-разработчика. Если построение графиков, диаграмм, карт и дашбордов до сих пор никогда не были вашей головной болью, просто немного подождите: наверняка и вы скоро вступите в наш «клуб».
Данная статья дает общее, но вовлеченное представление о восьми самых интересных, на мой взгляд, JavaScript-библиотеках для построения интерактивных геовизуализаций. В целом, таких решений сейчас много, и выбрать оптимальное под тот или иной конкретный проект – задача порой непростая как минимум по времени. Этой публикацией я попытаюсь хотя бы немного упростить жизнь тем, кто только начинает разбираться в данной теме. Кстати, это слегка модифицированный перевод моей недавней статьи на Onextrapixel (оригинал на английском).
Теория категорий на JavaScript. Часть 1. Категория множеств
2016-10-31 в 2:29, admin, рубрики: d3.js, javascript, Блог компании Группа компаний «ЦИТ» (Центр ИТ), математика, ооп, теория категорий, функциональное программированиеАбстракция – это одна из основных техник в ИТ. Любой язык программирования или моделирования, любая парадигма программирования (процедурная, функциональная, ООП, …) дают ответ на вопрос, как и от чего нужно абстрагироваться. Причём, адепты каждого подхода предлагают какой-то свой вариант абстракции.
Если вы хотите увидеть истинную, универсальную абстракцию, то вступайте в нашу… изучайте теорию категорий. В статье на примере категории множеств с картинками и JavaScript-кодом объясняются самые базовые понятия теории категорий: пределы, универсальное свойство. Рассматривается вычислительный аспект теории категорий.
Также немного говорится про классы, примеси и смеси в JavaScript.
Примеры из статьи можно посмотреть тут.
Читать полностью »
D3.js. Визуализация графов
2016-06-29 в 16:13, admin, рубрики: d3.js, force layout, javascript, Алгоритмы, библиотека javascript, визуализация данныхD3.js — это библиотека JavaScript для управления документами, в основе которых лежат данные. D3 помогает претворить данные в жизнь, используя HTML, SVG и CSS. D3 позволяет привязывать произвольные данные к DOM, и затем применять результаты манипуляций с ними к документу.
Для понимания статьи пригодится знание основ D3, и в ней мы рассмотрим реализацию алгоритмов визуализации графа на основе сил (Force-directed graph drawing algorithms), которая в D3 (version 3) имеет название Force Layout. Это класс алгоритмов визуализации графов, которые вычисляют позицию каждого узла, моделируя силу притяжения между каждой парой связанных узлов, а также отталкивающую силу между узлами.