Wordpress и веб-разработка

Создайте свою собственную панель управления погодой в этом мастер-классе Google Spreadsheet

Создайте свою собственную панель управления погодой в этом мастер-классе Google Spreadsheet

«Компьютер! Показать все текущие погодные условия в пределах 300 миль от моего текущего местоположения »
«Да, капитан»
«Теперь покажите мне уровни влажности для этих мест, нанесенные на карту по долготе и широте»
«Да, капитан»

Хотели бы вы превратить свою учетную запись Google Drive в интеллектуальную систему анализа погоды? и жить этой фантазией Star Trek? Хорошо, возможно, вы не сможете превратить электронные таблицы Google в искусственно интеллектуальную компьютерную систему, которая будет реагировать на ваши голосовые команды, но в этой статье я покажу вам, как вы можете импортировать данные о погоде из Интернета и иметь собственную настраиваемую панель управления с вся информация, которая важна для вас.

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

Это подобно автоматическим отчетам в виде электронных таблиц Я описал не так давно, но в этом случае он использует данные из Интернета, а не данные Google Analytics. Итак, если вы хотите настроить собственную автоматически обновляемую панель погоды в своей учетной записи Google Drive, начнем!

Поиск источника данных о погоде

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

погода-dashboard1

В данном случае формат HTML, который нас интересует, — это либо «класс span», либо «класс p», который идентифицирует конкретные данные. Например, как показано ниже, вы можете видеть, что класс «myforecast-current-lrg» идентифицирует последнюю записанную температуру для запрашиваемой области.

погода-dashboard2

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

Настройка данных источника погоды

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

Для температуры, например, работает следующее:

= importxml (B12; «// p [@ class = ‘myforecast-current-lrg’]»)

B12 содержит URL после выполнения запроса местоположения. Использование «// p [@ class =» — это то, как настроить запрос Xpath для извлечения «класса p» на странице с указанным именем. Этот запрос возвращает температуру на странице.

погода-dashboard4

Извлечение влажности, скорости ветра и остальных точек данных фактически требовало извлечения элементов списка внутри списка UL с именем класса «current-condition-detail». Следующая инструкция ImportXML выполняет это:

= importxml (B12; «// ul [@ class = ‘current-условий-detail’] // li»)

Опять «ul» идентифицирует базовый элемент, а затем имя класса указывается в скобках, как показано. Далее следует «// li», указывающий, что вы хотите извлечь все элементы списка внутри этого класса UL.

Это заполняет остальные элементы данных в исходном листе для этого местоположения.

погода-dashboard7

В этом случае вам также следует включить URL-адрес, поскольку в URL-адресе указана широта и долгота, и вы можете использовать это с помощью карт Google Spreadsheet для построения точек данных на карте (показано ниже).

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

Создание главной таблицы панели инструментов

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

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

погода-dashboard8

Как только вы закончите, все данные, которые вы удалили с веб-сайта для каждого местоположения, будут размещены в этой единой таблице для удобства просмотра (и составления диаграмм).

погода-dashboard10

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

= середина (C2,1, найти ( «F», C2) -2)

Это в основном находит местоположение единицы, а затем извлекает фактическое значение до тех пор, пока не начнется текст единицы. После того, как вы извлекли только число, вам необходимо преобразовать его в фактическое значение в электронной таблице, чтобы вы могли выполнять вычисления или составлять диаграммы. Сделать это просто с помощью функции «value», как показано здесь.

погода-dashboard11

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

Создание вашей панели погоды

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

погода-dashboard12

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

Ниже я составил график температуры по координатам GPS в виджете картографирования, доступном в таблицах Google. Большие круги на карте обозначают места с более высокими температурами.

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

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

Можете ли вы вспомнить некоторые забавные и креативные способы использования ImportXML и Google Spreadsheets? Поделитесь некоторыми своими идеями, и, возможно, мы сможем попытаться реализовать одну из ваших идей в следующей статье!

Похожие посты
Wordpress и веб-разработка

Добавить красивые слайд-шоу в сообщения WordPress с помощью SlideDeck

Wordpress и веб-разработка

Сделайте свой WordPress блог iPad удобным с Onswipe

Wordpress и веб-разработка

Как создать карту изображения с помощью GIMP

Wordpress и веб-разработка

WordPress: еще 3 скрытых жемчужины в наборе плагинов Jetpack, а также обновлено приложение WordPress!