JavaScript. Подробное руководство, 6-е издание

   var height = parselnt(elt.getAttributefdata-height")) ||
   parseInt(style.fontSize) || 20;
   var width = parseInt(elt.getAttribute("data-width")) ||
   data.length * (parseInt(elt.getAttribute("data-dx")) || height/6);
   var ymin = parselnt(elt.getAttribute("data-ymin")) ||
   Math.min.apply(Math, data);
   var ymax = parseInt(elt.getAttribute("data-ymax")) || Math.max.apply(Math, data);
   if (ymin >= ymax) ymax = ymin + 1;

// Создать элемент <canvas>.
   var canvas = document.createElement("canvas”);
   canvas.width = width; // Установить размеры холста
   canvas.height = height;
   canvas.title = content; // Содержимое использовать как подсказку
   elt.innerHTML = "" ;// Стереть содержимое элемента
   elt.appendChild(canvas); // Вставить холст в элемент

   // Нарисовать график по точкам (і,data[і]), преобразовав в координаты холста,
   var context = canvas.getContext('2d');
   for(var і = 0; і < data.length; i++) { // Для каждой точки на графике
   var х = width*i/data.length; // Масштабировать і
   var у = (ymax-data[i])*height/(ymax-ymin); // и data[i]
   context.1іnеТо(х,у); // Первый вызов lineТо выполнит moveTo
   }
   context.strokeStyle = color; // Указать цвет кривой на диаграмме
   context.stroke; // и нарисовать ее
   }
  });

22 Прикладные интерфейсы HTML5

Под термином HTML5 обычно подразумевается последняя версия спецификации языка разметки HTML, но этот термин также используется для обозначения целого комплекса веб-технологий, которые разрабатываются и определяются как часть языка разметки HTML или сопутствующие ему. Официально этот комплекс технологий называется «Open Web Platform». Однако на практике чаще используется сокращенное название «HTML5», и в данной главе мы будем использовать его именно в этом смысле. В других главах этой книги уже описывались некоторые новые прикладные интерфейсы HTML5:

• В главе 15 были представлены методы getElementsByClassName, querySelectorAll и атрибуты данных элементов документа.

• В главе 16 было описано свойство classList элементов.

• В главе 18 рассказывалось о спецификации «XMLHttpRequest Level 2», о выполнении междоменных HTTP-запросов и о прикладном интерфейсе EventSource, определяемом спецификацией «Server-Sent Events».

• В главе 20 был описан прикладной интерфейс WebStorage и кэш приложений для автономных веб-приложений.

• В главе 21 были представлены элементы <audio>, <video> и <canvas>, а также средства для работы с векторной графикой SVG.

Эта глава охватывает ряд других прикладных интерфейсов HTML5:

• В разделе 22.1 рассматривается прикладной интерфейс объекта Geolocation, позволяющий броузерам определять географическое местонахождение пользователя (с его разрешения).

• В разделе 22.2 рассказывается о прикладных интерфейсах управления историей посещений, которые позволяют веб-приложениям сохранять и обновлять информацию о своем состоянии в ответ на использование кнопок Back (Назад) и Forward (Вперед) броузера, без необходимости выполнять полную перезагрузку страницы с веб-сервера.

• В разделе 22.3 описывается простой прикладной интерфейс передачи сообщений между документами с различным происхождением. Он обеспечивает безопасный способ обхода ограничений политики общего происхождения (раздел 13.6.2), препятствующих непосредственному взаимодействию документов, полученных от разных веб-серверов.

• В разделе 22.4 охватывается новая важная особенность HTML5: возможность выполнять программный код на языке JavaScript в отдельном фоновом потоке выполнения и безопасно взаимодействовать с этими «рабочими» потоками.

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

• В разделе 22.6 будут представлены двоичные объекты (Blob): нетипизированные порции данных, которые служат основным форматом обмена данными, используемым различными новыми прикладными интерфейсами для работы с двоичными данными. В этом разделе также охватывается несколько типов данных, связанных с большими двоичными объектами, и их прикладные интерфейсы: объекты File и FileReader, тип BlobBuilder и URL-адреса вида blob://.

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

• В разделе 22.8 демонстрируется прикладной интерфейс объекта IndexedDB, предназначенный для сохранения и извлечения объектов в простых базах данных. Как и интерфейс к файловой системе, прикладной интерфейс IndexedDB пока является нестабильным и не описывается в справочном разделе.

• Наконец, раздел 22.9 охватывает прикладной интерфейс веб-сокетов Web Sockets, позволяющий веб-приложениям устанавливать соединения с веб-серверами и использовать двунаправленные сетевые каналы на основе потоков вместо модели сетевых взаимодействий типа запрос/ответ, поддерживаемой с помощью объекта XMLHttpRequest.

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