Больше данных, больше таблиц API

Как API Google Таблиц использует магию (и код) для заполнения вашего листа визуальными данными.

Как большой поклонник Йо-Йо Ма, я экспериментировал с Google Vision API, передавая изображение виолончели. Получив результаты обнаружения меток API, я очень обрадовался, когда на моем экране выводятся такие слова, как String Instrument. Как здорово, что компьютер может распознавать виолончель и получать от него столько же удовольствия, сколько и я.

Однако в чем именно заключается точка отправки изображения через Vision API? Я уже вижу, что в нем, так зачем мне компьютер, чтобы повторять то, что я уже знаю?

Как и на большинство жизненных вопросов, ответ - Google Таблицы.

Таблицы - отличный инструмент для организации и визуализации данных, и (модное слово!) Машинное обучение - отличный способ получить такие данные. Машинное обучение, в частности Vision API, становится чрезвычайно полезным, когда возвращаемые данные собираются, систематизируются и визуально представляются в Таблицах.

«Но использование Таблиц может занять много времени и сбить с толку!»

Вы правы, это наверняка может быть, поэтому я использовал Google Sheets API и Cloud Functions, чтобы делать за меня всю грязную работу.

Получение данных.

Выполнить вызов API Google Vision так же просто, как написать пару строк кода.

const client = new vision.ImageAnnotatorClient();
const [result] = await client.labelDetection({image: 
    {content: fileBytes}
  });

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

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

var labelsResult = result.labelAnnotations;
var labels = labelsResult.map(label => label.description);
var labelScores = labelsResult.map(label => label.score);

В этих двух переменных, label и labelScores, я храню каждую метку, возвращаемую Vision API, а также соответствующую ей оценку. Однако этих потрясающих данных недостаточно. На самом деле данные практически бесполезны, если вы не знаете, что с ними делать или как их понимать.

Если вы не знаете, как поступить, вот подходящий вариант: отправить все в Таблицы.

Подготовка наших данных.

Спецификации обнаружения меток объясняют, что наши переменные label и labelScores будут просто картами JSON. Что, если в моем листе я хочу, чтобы каждая строка содержала одну метку и соответствующую ей оценку? Лучшим вариантом здесь является разделение этой карты JSON на 2D-массив, который отражает то, как мы хотим, чтобы наши данные отображались на листе.

Сначала мы используем JSON.stringify, чтобы превратить наши данные JSON в одну большую строку. Затем мы удаляем все нежелательные символы и, наконец, превращаем эту большую строку в массив, указывая новый индекс каждый раз, когда мы достигаем запятой. (Это потому, что метки в нашей возвращенной карте JSON разделены запятыми).

var labelData = JSON.stringify(labels, null, 2);
labelData = labelData.replace(/[\[\]'\"]+/g,'');
labelData = labelData.split(',');

Я могу выполнить те же самые строки кода в моем ответе JSON labelScores, чтобы получить еще один массив, содержащий все оценки. Я предпочитаю быть неоригинальным и назову этот второй массив scoreData.

Запись на лист.

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

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

var dataLength = labelData.length;

Я также знаю, что для каждой строки мне нужна одна метка в столбце A и соответствующая оценка в столбце B. Итак, именно так должен выглядеть мой массив значений.

var values = []
  for (var i = 0; i < dataLength; i++) {
    var dataToPush = [labelData[i], scoreData[i]];
    values.push(dataToPush);
  }

Чтобы передать эти значения на мой лист, мне нужно вызвать ...

sheet.spreadsheets.values.update(request, {

… Где моя переменная запроса выглядит следующим образом:

var body = {
 values: values
}
var request = {
    spreadsheetId: 'YOUR_SHEET_ID',
    valueInputOption: 'USER_ENTERED',
    range: 'A1:B',
    resource: body,
    auth: // YOUR OAUTH CLIENT
};

Указание spreadsheetId имеет решающее значение при вызове API Таблиц, чтобы гарантировать, что вы изменяете именно тот лист, который вам нужен. Вот, как найти свой.

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

Кроме того, значение диапазона (указанное в обозначении A1) необходимо для обеспечения того, чтобы ваши данные были отформатированы на вашем листе, как указано. Обозначение A1 'A1: B' означает начать запись в ячейке A1, перейти к столбцу B, затем продолжить движение вниз по строкам и переключение из столбца A в столбец B до тех пор, пока все ваши данные записаны. Таким образом, даже если вы настроили свой массив значений как как вы хотите, чтобы ваши данные отображались, вам необходимо правильно установить диапазон в где вы хотите, чтобы она отображалась.

Создание визуальных данных.

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

Ваш следующий шаг - помнить, что все любят графики! Давайте воспользуемся GCF, чтобы сделать его.

Вызов Sheets API для создания столбчатой диаграммы из существующих данных представляет собой запрос batchUpdate, который очень похож на наш ранее сделанный вызов values.update. Ключевым отличием здесь является параметр запрос, который мы отправляем в нашу batchUpdate: неудобно длинное тело JSON, в котором указаны домен, серия, заголовки осей и позиция.

Давайте посмотрим на некоторые особенности нашего тела JSON, которые мы будем хранить в переменной с именем chartRequest:

    chartType: "COLUMN",
              legendPosition: "BOTTOM_LEGEND",
              axis: [
                {
                  position: "BOTTOM_AXIS",
                  title: "Vision Labels"
                },
                {
                  position: "LEFT_AXIS",
                  title: "Score" 
                }
              ],

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

Помимо длинного тела JSON, сам запрос batchUpdate довольно прост ...

sheet.spreadsheets.batchUpdate({
      spreadsheetId,
      resource: chartRequest,
});

Это все, что вам нужно: идентификатор вашей электронной таблицы (где искать данные) и ваш chartRequest (как создать диаграмму из данных). Видеть? API Таблиц похож на волшебство.

Разрешение экзистенциального кризиса.

Хорошо, мы поняли, вы можете использовать API Таблиц, чтобы делать классные вещи с данными и графиками, но какой в этом смысл?

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

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

Большие данные, небольшие проблемы.

Вы можете найти мой полный код GCF на моем GitHub.

Особая благодарность моему хозяину стажировки, Ану.

Дайте мне знать, как вы используете GCF и Sheets API для экспериментов с данными, я буду рад услышать от вас!

Больше данных, больше таблиц API