Статьи

Визуализация данных с помощью Flex, часть I

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

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

Перед тем как начать, вы должны загрузить пример проекта в виде архива Flex Builder.

У нас есть еще одна статья-викторина для вас на этой неделе, на этот раз спонсируемая Adobe, поэтому, как только вы прочитаете статью, обязательно проверьте себя!

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


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


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

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

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

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

Я написал быстрый и грязный PHP-скрипт, который извлекает данные из базы данных и записывает их в файл в виде объекта JSON. Структура созданного файла JSON будет выглядеть следующим образом:

  {"keyword": "ajax", "count": 12479, "links": {"flash": 441, "php": 1900, "javascript": 2304, "flex": 102, "adobe": 61, "microsoft": 123, "asp": 473, ".net": 180, "dotnet": 1, "css": 508, "xml": 1184, "html": 940, "mysql": 369, " macromedia ": 18," jsp ": 29," ruby ​​": 160," xhtml ": 223," dhtml ": 114," coldfusion ": 76," air ": 16," postgres ": 14," actionscript " : 24, "таблица стилей": 39, "cgi": 18, "silverlight": 15, "groovy": 2}} 

count Значения link Так, например, в приведенном выше наборе данных мы можем видеть, что слово «ajax» использовалось 12 479 раз, и что есть 2304 потока, содержащих оба слова «ajax» и «javascript».

Я кратко расскажу о скрипте PHP, так как он выходит за рамки этой статьи. Важно понимать, что мы извлекаем некоторые конкретные данные из нашей базы данных для передачи в наше приложение Flex. Тип сценария, который вы здесь используете, будет зависеть от того, какие данные вы хотите визуализировать.

Первым шагом в нашем скрипте является определение массива ключевых слов и другого массива для хранения частот и ссылок, которые мы находим в постах:

  // заполняем массив ключевых слов для поиска, с подсчетами и массивами ссылок $ keys = array ('ajax', 'coldfusion', 'flash', 'flex', 'air', 'adobe', 'macromedia', ' Microsoft ' 'PHP', 'рубин', 'заводной', 'осина', ' сети', 'DotNet', 'ActionScript', 'Javascript', 'DHTML', 'JSP', 'CGI',' CSS ',' таблица стилей ',' silverlight ',' mysql ',' postgres ',' xhtml ',' xml ',' html '); $ keyFreqs = array (); foreach ($ keys как $ key) {$ keyFreqs [ $ key] = array ("count" => 0, "links" => array ());} 

Затем мы подключаемся к базе данных, перебираем каждый поток и каждый пост в этом потоке, сканируем наши ключевые слова и по мере добавления добавляем в наш массив $keyFreqs Наконец, мы сглаживаем массив, чтобы упростить доступ к нему во Flex и сохранить его в файл в формате JSON:

  // Соединяем с базой данных $ link = mysqli_connect ('localhost', 'root', 'root'); if (! Mysqli_select_db ($ link, 'forum')) {print 'Невозможно выбрать базу данных';} // цикл через нити и их сообщения postid, pagetext ОТ сообщения WHERE threadid = ". $ row ['threadid']);  while ($ post = mysqli_fetch_array ($ posts)) {$ tempKeys = array ();  // перебираем список ключевых слов foreach ($ keys as $ key) {// ищем ключ в посте $ pattern = "/".  $ ключ.  "[^ A-Za-Z0-9] * / я";  $ tempCount = preg_match_all ($ pattern, $ post ['pagetext'], $ match);  // если мы нашли одно или несколько совпадений, добавьте ключ во временный список if ($ tempCount> 0) {$ tempKeys [] = $ key;  } // увеличиваем глобальное количество для этого ключевого слова $ keyFreqs [$ key] ["count"] + = $ tempCount;  } // перебираем список ключевых слов, для которых мы нашли счетчик //, и увеличиваем связь между ними foreach ($ tempKeys as $ a) {foreach ($ tempKeys as $ b) {if ($ a! = $ b) { if (isset ($ keyFreqs [$ a] ["links"] [$ b])) {$ keyFreqs [$ a] ["links"] [$ b] + = 1;  } else {$ keyFreqs [$ a] ["links"] [$ b] = 0;  }}}}}} // Выровнять массив и записать его в файл в формате JSON $ newArray = array (); foreach ($ keyFreqs as $ keyword => $ value) {$ newArray [] = array ("keyword "=> $ ключевое слово," count "=> $ value ['count']," links "=> $ value [" links "]);} $ fh = fopen ('json_data.txt', 'w'); FWRITE ($ ФХ, json_encode ($ newArray));