2gis-maps
Version:
Interactive 2GIS maps API, based on Leaflet
687 lines (664 loc) • 45.4 kB
HTML
<h2 id="векторные-слои">Векторные слои</h2><p>В данном разделе рассматривается работа с векторными слоями, представляющие собой геометрические
объекты на карте: окружности, ломаные линии, многоугольники.</p>
<p><dl class="api-incut"><ul class="page-contents"><li><a href="#dgpath">DG.Path</a><ul><li><a href="#опции">Опции</a></li><li><a href="#события">События</a></li><li><a href="#методы">Методы</a></li></ul></li><li><a href="#dgpolyline">DG.Polyline</a><ul><li><a href="#пример-использования">Пример использования</a></li><li><a href="#создание">Создание</a></li><li><a href="#опции-1">Опции</a></li><li><a href="#события-1">События</a></li><li><a href="#методы-1">Методы</a></li></ul></li><li><a href="#dgpolygon">DG.Polygon</a><ul><li><a href="#пример-использования-1">Пример использования</a></li><li><a href="#создание-1">Создание</a></li><li><a href="#опции-2">Опции</a></li><li><a href="#события-2">События</a></li><li><a href="#методы-2">Методы</a></li></ul></li><li><a href="#dgrectangle">DG.Rectangle</a><ul><li><a href="#пример-использования-2">Пример использования</a></li><li><a href="#создание-2">Создание</a></li><li><a href="#опции-3">Опции</a></li><li><a href="#события-3">События</a></li><li><a href="#методы-3">Методы</a></li></ul></li><li><a href="#dgcircle">DG.Circle</a><ul><li><a href="#пример-использование">Пример использование</a></li><li><a href="#создние">Создние</a></li><li><a href="#опции-4">Опции</a></li><li><a href="#события-4">События</a></li><li><a href="#методы-4">Методы</a></li></ul></li><li><a href="#dgcirclemarker">DG.CircleMarker</a><ul><li><a href="#создание-3">Создание</a></li><li><a href="#опции-5">Опции</a></li><li><a href="#события-5">События</a></li><li><a href="#методы-5">Методы</a></li></ul></li><li><a href="#dgsvg">DG.Svg</a><ul><li><a href="#пример-использования-3">Пример использования</a></li><li><a href="#создание-4">Создание</a></li><li><a href="#опции-6">Опции</a></li><li><a href="#события-6">События</a></li><li><a href="#методы-6">Методы</a></li><li><a href="#функции">Функции</a></li></ul></li><li><a href="#dgcanvas">DG.Canvas</a><ul><li><a href="#пример-использована">Пример использована</a></li><li><a href="#создание-canvas">Создание Canvas</a></li><li><a href="#опции-7">Опции</a></li><li><a href="#события-7">События</a></li><li><a href="#методы-7">Методы</a></li></ul></dl></p>
<h3 id="dgpath">DG.Path</h3><p>Абстрактный класс, содержащий базовые опции и константы векторных слоев (Polygon, Polyline, Circle).
Не используйте этот класс напрямую. Расширяет <a href="/doc/maps/ru/manual/base-classes#dglayer">Layer</a>.</p>
<h4 id="опции">Опции</h4><table id="dgpath-options">
<thead>
<tr>
<th>Опция</th>
<th>Тип</th>
<th>По умолчанию</th>
<th>Описание</th>
</tr>
</thead>
<tbody>
<tr id="path-stroke">
<td><code><b>stroke</b></code></td>
<td><code>Boolean </code></td>
<td><code>true</code></td>
<td>Нужно ли рисовать границу фигуры. Установите значение в <code>false</code>,
чтобы отключить границы многоугольников или окружностей.</td>
</tr>
<tr id="path-color">
<td><code><b>color</b></code></td>
<td><code>String </code></td>
<td><code>'#3388ff'</code></td>
<td>Цвет границы.</td>
</tr>
<tr id="path-weight">
<td><code><b>weight</b></code></td>
<td><code>Number </code></td>
<td><code>3</code></td>
<td>Ширина границы в пикселях.</td>
</tr>
<tr id="path-opacity">
<td><code><b>opacity</b></code></td>
<td><code>Number </code></td>
<td><code>1.0</code></td>
<td>Прозрачность границы.</td>
</tr>
<tr id="path-linecap">
<td><code><b>lineCap</b></code></td>
<td><code>String</code></td>
<td><code>'round'</code></td>
<td>Строка, которая определяет вид границы,
<a target="_blank" href="https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-linecap">
на концах ломаной</a>.</td>
</tr>
<tr id="path-linejoin">
<td><code><b>lineJoin</b></code></td>
<td><code>String </code></td>
<td><code>'round'</code></td>
<td>Строка, которая определяет вид границы,
<a target="_blank" href="https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-linejoin">
на изгибах</a> ломаной.</td>
</tr>
<tr id="path-dasharray">
<td><code><b>dashArray</b></code></td>
<td><code>String </code></td>
<td><code>null</code></td>
<td>Строка <a target="_blank" href="https://developer.mozilla.org/en/SVG/Attribute/stroke-dasharray">шаблона границы</a>.
Не работает на canvas слоях (например, Android 2).</td>
</tr>
<tr id="path-dashoffset">
<td><code><b>dashOffset</b></code></td>
<td><code>String </code></td>
<td><code>null</code></td>
<td>Строка, которая определяет
<a href="https://developer.mozilla.org/docs/Web/SVG/Attribute/stroke-dashoffset">расстояние,
через которое начинается штриховка</a>. Не работает на canvas слоях (например, Android 2).</td>
</tr>
<tr id="path-fill">
<td><code><b>fill</b></code></td>
<td><code>Boolean </code></td>
<td><code>depends</code></td>
<td>Заполнять ли фигуру цветом. Установите значение в <code>false</code>,
чтобы отключить заполнение многоугольников или окружностей.</td>
</tr>
<tr id="path-fillcolor">
<td><code><b>fillColor</b></code></td>
<td><code>String </code></td>
<td><code>*</code></td>
<td>Цвет заливки. Цвет по умолчанию определяется опцией <a href="#path-color"><code>color</code></a>.</td>
</tr>
<tr id="path-fillopacity">
<td><code><b>fillOpacity</b></code></td>
<td><code>Number </code></td>
<td><code>0.2</code></td>
<td>Прозрачность заливки.</td>
</tr>
<tr id="path-fillrule">
<td><code><b>fillRule</b></code></td>
<td><code>String </code></td>
<td><code>'evenodd'</code></td>
<td>Строка, которая задает,
<a href="https://developer.mozilla.org/docs/Web/SVG/Attribute/fill-rule">как определяется
внутренняя область фигуры</a>.</td>
</tr>
<tr id="path-interactive">
<td><code><b>interactive</b></code></td>
<td><code>Boolean </code></td>
<td><code>true</code></td>
<td>Если <code>false</code>, векторный слой не будет генерировать события мыши и будет
вести себя, как часть нижележащего слоя карты.</td>
</tr>
<tr id="path-renderer">
<td><code><b>renderer</b></code></td>
<td><code><a href="/doc/maps/ru/manual/base-classes#dgrenderer">Renderer</a></code></td>
<td><code></code></td>
<td>Использовать этот экземпляр <a href="/doc/maps/ru/manual/base-classes#dgrenderer"><code>Renderer</code></a>
для данного векторного объекта. Переопределяет
<a href="/doc/maps/ru/manual/map#map-renderer">renderer карты</a>, установленный по умолчанию.</td>
</tr>
<tr id="path-classname">
<td><code><b>className</b></code></td>
<td><code>string </code></td>
<td><code>null</code></td>
<td>Добавляет класс в соотвествующий атрибут элемента (только для SVG).</td>
</tr>
</tbody>
</table>
<p>Опции, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-options">Layer</a> <!-- TODO: include options --></p>
<h4 id="события">События</h4><p>События, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-events">Layer</a> <!-- TODO: include events --></p>
<p>События попапа, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-popup-events">Layer</a> <!-- TODO: include popup events --></p>
<h4 id="методы">Методы</h4><table id="dgpath-methods">
<thead>
<tr>
<th>Метод</th>
<th>Возвращает</th>
<th>Описание</th>
</tr>
</thead>
<tbody>
<tr id="path-redraw">
<td><code><b>redraw</b>()</code></td>
<td><code>this</code></td>
<td>Перерисовывает слой. Удобно при изменении его координат.</td>
</tr>
<tr id="path-setstyle">
<td><code>
<b>setStyle</b>(
<nobr><<a href="#dgpath-options">Path options</a>> <i>style</i>)</nobr>
</code></td>
<td><code>this</code></td>
<td>Изменяет внешний вид объекта с помощью <a href="#dgpath-options">опций класса Path</a>.</td>
</tr>
<tr id="path-bringtofront">
<td><code><b>bringToFront</b>()</code></td>
<td><code>this</code></td>
<td>Позиционирует слой поверх всех остальных.</td>
</tr>
<tr id="path-bringtoback">
<td><code><b>bringToBack</b>()</code></td>
<td><code>this</code></td>
<td>Позиционирует слой под остальными.</td>
</tr>
</tbody>
</table>
<p>Методы попапа, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-popup-methods">Layer</a> <!-- TODO: include methods --></p>
<p>Методы, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-methods">Layer</a> <!-- TODO: include methods --></p>
<p>Методы, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dgevented-methods">Evented</a> <!-- TODO: include methods --></p>
<h3 id="dgpolyline">DG.Polyline</h3><p>Класс для отрисовки ломаных линий на карте. Расширяет <a href="#dgpath">Path</a>.</p>
<h4 id="пример-использования">Пример использования</h4><pre><code>// создает ломаную красного цвета из массива точек LatLng
var latlngs = [
[-122.68, 45.51],
[-122.43, 37.77],
[-118.2, 34.04]
];
var polyline = DG.polyline(latlngs, {color: 'red'}).addTo(map);
// увеличиваем масштаб так, чтобы было видно всю ломаную
map.fitBounds(polyline.getBounds());
</code></pre><p>Вы также можете передать многомерный массиив, который представляет собой фигуру MultiPolyline:</p>
<pre><code>// создает красную ломаную из массива массивов точек LatLng
var latlngs = [
[[-122.68, 45.51],
[-122.43, 37.77],
[-118.2, 34.04]],
[[-73.91, 40.78],
[-87.62, 41.83],
[-96.72, 32.76]]
];
</code></pre><h4 id="создание">Создание</h4><table>
<thead>
<tr>
<th>Конструктор</th>
<th>Использование</th>
</tr>
</thead>
<tbody>
<tr id="polyline-dg-polyline">
<td><code><b>DG.polyline</b>(
<nobr><LatLng[]> <i>latlngs</i></nobr>,
<nobr><<a href="#dgpath-options">Path options</a>> <i>options?</i>)</nobr>
</code></td>
<td>Создает объект ломаной по переданному массиву географических точек и необязательному объекту опций.
Вы можете создать объект <a href="#dgpolyline"><code>Polyline</code></a>, состоящий из
множества линий (так называемый <code>MultiPolyline</code>), передав массив массивов
географических точек.</td>
</tr>
</tbody>
</table>
<h4 id="опции-1">Опции</h4><table id="dgpolyline-options">
<thead>
<tr>
<th>Опция</th>
<th>Тип</th>
<th>По умолчанию</th>
<th>Описание</th>
</tr>
</thead>
<tbody>
<tr id="polyline-smoothfactor">
<td><code><b>smoothFactor</b></code></td>
<td><code>Number </code>
<td><code>1.0</code></td>
<td>Степень упрощения ломаной на каждом уровне масштаба. Большее значение означает более высокую
производительность, но худшее качество, меньшее же значение — наоборот.</td>
</tr>
<tr id="polyline-noclip">
<td><code><b>noClip</b></code></td>
<td><code>Boolean: false</code>
<td><code></code></td>
<td>Отключает отсечение ломаной.</td>
</tr>
</tbody>
</table>
<p>Опции, унаследованные от <a href="#dgpath-options">Path</a> <!-- TODO: include options --></p>
<p>Опции, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-options">Layer</a> <!-- TODO: include options --></p>
<h4 id="события-1">События</h4><p>События, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-events">Layer</a> <!-- TODO: include events --></p>
<p>События попапов, унаследованные <a href="/doc/maps/ru/manual/base-classes#dglayer-popup-events">Layer</a> <!-- TODO: include popup events --></p>
<h4 id="методы-1">Методы</h4><table id="dgpolyline-methods">
<thead>
<tr>
<th>Метод</th>
<th>Возвращает</th>
<th>Описание</th>
</tr>
</thead>
<tbody>
<tr id="polyline-togeojson">
<td><code><b>toGeoJSON</b>()</code></td>
<td><code>Object</code></td>
<td>Возвращает <a href="http://en.wikipedia.org/wiki/GeoJSON">GeoJSON</a>
представление ломаной (GeoJSON LineString или <code>MultiLineString</code>).</td>
</tr>
<tr id="polyline-getlatlngs">
<td><code><b>getLatLngs</b>()</code></td>
<td><code>LatLng[]</code></td>
<td>Возвращает массив точек объекта или массив массивов точек, в случае мультиломаной.</td>
</tr>
<tr id="polyline-setlatlngs">
<td><code><b>setLatLngs</b>(<nobr><LatLng[]> <i>latlngs</i>)</nobr></code></td>
<td><code>this</code></td>
<td>Заменяет все точки ломаной данными из переданного массива.</td>
</tr>
<tr id="polyline-isempty">
<td><code><b>isEmpty</b>()</code></td>
<td><code>Boolean</code></td>
<td>Возвращает <code>true</code>, если у Polyline нет точек LatLngs.</td>
</tr>
<tr id="polyline-getcenter">
<td><code><b>getCenter</b>()</code></td>
<td><code><a href="/doc/maps/ru/manual/basic-types#dglatlng">LatLng</a></code></td>
<td>Возвращает центр (<a href="http://en.wikipedia.org/wiki/Centroid">centroid</a>) ломаной.</td>
</tr>
<tr id="polyline-getbounds">
<td><code><b>getBounds</b>()</code></td>
<td><code><a href="/doc/maps/ru/manual/basic-types#dglatlngbounds">LatLngBounds</a></code></td>
<td>Возвращает границы ломаной.</td>
</tr>
<tr id="polyline-addlatlng">
<td><code><b>addLatLng</b>(
<nobr><<a href="/doc/maps/ru/manual/basic-types#dglatlng">LatLng</a>> <i>latlng</i>)</nobr>
<nobr><LatLng[]> <i>latlngs?</i></nobr>,
</code></td>
<td><code>this</code></td>
<td>Добавляет точку в ломаную. По умолчанию, добавляет точку в первое звено
списка ломаных в случае мультиломаной. Это поведение может быть переопределено передачей
определенного звена, как массива элементов LatLng (к которому вы могли получить
доступ ранее, с помощью метода <a href="#polyline-getlatlngs">getlatlngs</a>).</td>
</tr>
</tbody>
</table>
<p>Методы, унаследованные от <a href="#dgpath-methods">Path</a> <!-- TODO: include methods --></p>
<p>Методы попапа, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-popup-methods">Layer</a> <!-- TODO: include methods --></p>
<p>Методы, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-methods">Layer</a> <!-- TODO: include methods --></p>
<p>Методы, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dgevented-methods">Evented</a> <!-- TODO: include methods --></p>
<h3 id="dgpolygon">DG.Polygon</h3><p>Класс для отрисовки многоугольников на карте. Расширяет <a href="#dgpolyline">Polyline</a>.</p>
<p>Обратите внимание на то, что среди точек, которые передаются для создания многоугольника, не должно быть
дополнительной точки, совпадающей с первой - такие точки лучше предварительно отфильтровать.</p>
<h4 id="пример-использования-1">Пример использования</h4><pre><code>// создает красный многоугольник из массива точек LatLng
var latlngs = [[-111.03, 41],[-111.04, 45],[-104.05, 45],[-104.05, 41]];
var polygon = DG.polygon(latlngs, {color: 'red'}).addTo(map);
// увеличивает масштаб карты до максимального значения, при котором виден весь многоугольник
map.fitBounds(polygon.getBounds());
</code></pre><p>Возможно также создать многоугольник с дырами, передав массив массивов latlngs,
первый latlngs массив отвечает за внешние границы, остальные описывают области внутри.</p>
<pre><code>var latlngs = [
[[-111.03, 41],[-111.04, 45],[-104.05, 45],[-104.05, 41]], // внешняя граница
[[-108.58,37.29],[-108.58,40.71],[-102.50,40.71],[-102.50,37.29]] // дыра
];
</code></pre><p>Также, вы можете передать многомерный массив, который представляет собой мульти-многоугольник (MultiPolygon).</p>
<pre><code>var latlngs = [
[ // первый многоугольник
[[-111.03, 41],[-111.04, 45],[-104.05, 45],[-104.05, 41]], // внешняя граница
[[-108.58,37.29],[-108.58,40.71],[-102.50,40.71],[-102.50,37.29]] // дыра
],
[ // второй многоугольник
[[-109.05, 37],[-109.03, 41],[-102.05, 41],[-102.04, 37],[-109.05, 38]]
]
];
</code></pre><h4 id="создание-1">Создание</h4><table>
<thead>
<tr>
<th>Конструктор</th>
<th>Описание</th>
</tr>
</thead>
<tbody>
<tr id="polygon-dg-polygon">
<td><code>
<b>DG.polygon</b>(
<nobr><LatLng[]> <i>latlngs</i></nobr>,
<nobr><Polyline options> <i>options?</i>)</nobr>
</code></td>
<td></td>
</tr>
</tbody>
</table>
<h4 id="опции-2">Опции</h4><p>Опции, унаследованные от <a href="#dgpolyline-options">Polyline</a> <!-- TODO: include options --></p>
<p>Опции, унаследованные от <a href="#dgpath-options">Path</a> <!-- TODO: include options --></p>
<p>Опции, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-options">Layer</a> <!-- TODO: include options --></p>
<h4 id="события-2">События</h4><p>События, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-events">Layer</a> <!-- TODO: include events --></p>
<p>События попапов, унаследованные <a href="/doc/maps/ru/manual/base-classes#dglayer-popup-events">Layer</a> <!-- TODO: include popup events --></p>
<h4 id="методы-2">Методы</h4><p><span id="#dgpolygon-methods"></span></p>
<p>Методы, унаследованные от <a href="#dgpolyline-methods">Polyline</a> <!-- TODO: include methods --></p>
<p>Методы, унаследованные от <a href="#dgpath-methods">Path</a> <!-- TODO: include methods --></p>
<p>Методы попапа, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-popup-methods">Layer</a> <!-- TODO: include methods --></p>
<p>Методы, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-methods">Layer</a> <!-- TODO: include methods --></p>
<p>Методы, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dgevented-methods">Evented</a> <!-- TODO: include methods --></p>
<h3 id="dgrectangle">DG.Rectangle</h3><p>Класс для отрисовки прямоугольников на карте. Расширяет <a href="#dgpolygon">Polygon</a>.</p>
<h4 id="пример-использования-2">Пример использования</h4><pre><code>// создаем географические границы прямоугольника
var bounds = [[54.559322, -5.767822], [56.1210604, -3.021240]];
// создаем оранжевый прямоугольник
DG.rectangle(bounds, {color: "#ff7800", weight: 1}).addTo(map);
// подстраиваем центр карты и масштаб так, чтобы прямоугольник было видно
map.fitBounds(bounds);
</code></pre><h4 id="создание-2">Создание</h4><table>
<thead>
<tr>
<th>Конструктор</th>
<th>Описание</th>
</tr>
</thead>
<tbody>
<tr id="rectangle-dg-rectangle">
<td><code>
<b>DG.rectangle</b>(
<nobr><<a href="/doc/maps/ru/manual/basic-types#dglatlngbounds">LatLngBounds</a>> <i>latLngBounds</i></nobr>,
<nobr><Polyline options> <i>options?</i>)</nobr>
</code></td>
<td></td>
</tr>
</tbody>
</table>
<h4 id="опции-3">Опции</h4><p>Опции, унаследованные от <a href="#dgpolyline-options">Polyline</a> <!-- TODO: include options --></p>
<p>Опции, унаследованные от <a href="#dgpath-options">Path</a> <!-- TODO: include options --></p>
<p>Опции, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-options">Layer</a> <!-- TODO: include options --></p>
<h4 id="события-3">События</h4><p>События, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-events">Layer</a> <!-- TODO: include events --></p>
<p>События попапов, унаследованные <a href="/doc/maps/ru/manual/base-classes#dglayer-popup-events">Layer</a> <!-- TODO: include popup events --></p>
<h4 id="методы-3">Методы</h4><table>
<thead>
<tr>
<th>Метод</th>
<th>Возвращает</th>
<th>Описание</th>
</tr>
</thead>
<tbody>
<tr id="rectangle-setbounds">
<td><code><b>setBounds</b>(
<nobr><<a href="/doc/maps/ru/manual/basic-types#dglatlngbounds">LatLngBounds</a>> <i>latLngBounds</i>)</nobr>
</code></td>
<td><code>this</code></td>
<td>Перерисовывает прямоугольник с новыми границами.</td>
</tr>
</tbody>
</table>
<p>Методы, унаследованные от <a href="#dgpolygon-method">Polygon</a> <!-- TODO: include methods --></p>
<p>Методы, унаследованные от <a href="#dgpath-methods">Path</a> <!-- TODO: include methods --></p>
<p>Методы попапа, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-popup-methods">Layer</a> <!-- TODO: include methods --></p>
<p>Методы, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-methods">Layer</a> <!-- TODO: include methods --></p>
<p>Методы, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dgevented-methods">Evented</a> <!-- TODO: include methods --></p>
<h3 id="dgcircle">DG.Circle</h3><p>Класс для отрисовки окружности на карте. Расширяет <a href="#dgpath">Path</a>. Это аппроксимация, которая начинает
отличаться от настоящей окружности ближе к полюсам (из-за искажений проекции).</p>
<h4 id="пример-использование">Пример использование</h4><pre><code>DG.circle([50.5, 30.5], 200).addTo(map);
</code></pre><h4 id="создние">Создние</h4><table>
<thead>
<tr>
<th>Конструктор</th>
<th>Описание</th>
</tr>
</thead>
<tbody>
<tr id="circle-dg-circle">
<td><code>
<b>DG.circle</b>(
<nobr><<a href="/doc/maps/ru/manual/basic-types#dglatlng">LatLng</a>> <i>latlng</i></nobr>,
<nobr><<a href="#dgpath-options">Path options</a>> <i>options?</i>)</nobr>
</code></td>
<td>Создает объект круга по переданной географической точке и
объекту опций, в котором содежится радиус круга.</td>
</tr>
<tr id="circle-dg-circle-2">
<td><code><b>DG.circle</b>(
<nobr><<a href="/doc/maps/ru/manual/basic-types#dglatlng">LatLng</a>> <i>latlng</i></nobr>,
<nobr><Number> <i>radius</i></nobr>,
<nobr><<a href="#dgpath-options">Path options</a>> <i>options?</i>)</nobr>
</code></td>
<td>Устаревший способ создания круга, только для совместимости со старым кодом.
Не используйте его в своих новых приложениях и плагинах.</td>
</tr>
</tbody>
</table>
<h4 id="опции-4">Опции</h4><table>
<thead>
<tr>
<th>Опция</th>
<th>Тип</th>
<th>По умолчанию</th>
<th>Описание</th>
</tr>
</thead>
<tbody>
<tr id="circle-radius">
<td><code><b>radius</b></code></td>
<td><code>Number</code>
<td><code></code></td>
<td>Радиус круга в метрах.</td>
</tr>
</tbody>
</table>
<p>Опции, унаследованные от <a href="#dgpath-options">Path</a> <!-- TODO: include options --></p>
<p>Опции, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-options">Layer</a> <!-- TODO: include options --></p>
<h4 id="события-4">События</h4><p>События, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-events">Layer</a> <!-- TODO: include events --></p>
<p>События попапов, унаследованные <a href="/doc/maps/ru/manual/base-classes#dglayer-popup-events">Layer</a> <!-- TODO: include popup events --></p>
<h4 id="методы-4">Методы</h4><table>
<thead>
<tr>
<th>Метод</th>
<th>Возвращает</th>
<th>Описание</th>
</tr>
</thead>
<tbody>
<tr id="circle-setradius">
<td><code>
<b>setRadius</b>(
<nobr><Number> <i>radius</i>)</nobr>
</code></td>
<td><code>this</code></td>
<td>Устанавливает радиус окружности в метрах</td>
</tr>
<tr id="circle-getradius">
<td><code><b>getRadius</b>()</code></td>
<td><code>Number</code></td>
<td>Возвращает текущий радиус окружности в метрах</td>
</tr>
<tr id="circle-getbounds">
<td><code><b>getBounds</b>()</code></td>
<td><code><a href="/doc/maps/ru/manual/basic-types#dglatlngbounds">LatLngBounds</a></code></td>
<td>Возвращает <a href="/doc/maps/ru/manual/basic-types#dglatlngbounds"><code>LatLngBounds</code></a>
объекта.</td>
</tr>
</tbody>
</table>
<p>Методы, унаследованные от <a href="#dgcirclemarker-methods">CircleMarker</a> <!-- TODO: include methods --></p>
<p>Методы, унаследованные от <a href="#dgpath-methods">Path</a> <!-- TODO: include methods --></p>
<p>Методы попапа, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-popup-methods">Layer</a> <!-- TODO: include methods --></p>
<p>Методы, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-methods">Layer</a> <!-- TODO: include methods --></p>
<p>Методы, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dgevented-methods">Evented</a> <!-- TODO: include methods --></p>
<h3 id="dgcirclemarker">DG.CircleMarker</h3><p>Окружность фиксированного размера с радиусом указанным в пикселях. Расширяет <a href="#класс-dgpath">Path</a>.</p>
<h4 id="создание-3">Создание</h4><table>
<thead>
<tr>
<th>Конструктор</th>
<th>Описание</th>
</tr>
</thead>
<tbody>
<tr id="circlemarker-dg-circlemarker">
<td><code>
<b>DG.circleMarker</b>(
<nobr><<a href="/doc/maps/ru/manual/basic-types#dglatlng">LatLng</a>> <i>latlng</i></nobr>,
<i>options</i>)</code></td>
<td>Создает объект круглого маркера по переданной географической точке и необязательному объекту опций.</td>
</tr>
</tbody>
</table>
<h4 id="опции-5">Опции</h4><table>
<thead>
<tr>
<th>Опция</th>
<th>Тип</th>
<th>По умолчанию</th>
<th>Описание</th>
</tr>
</thead>
<tbody>
<tr id="circlemarker-radius">
<td><code><b>radius</b></code></td>
<td><code>Number </code></td>
<td><code>10</code></td>
<td>Радиус маркера в пикселях</td>
</tr>
</tbody>
</table>
<p>Опции, унаследованные от <a href="#dgpath-options">Path</a> <!-- TODO: include options --></p>
<p>Опции, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-options">Layer</a> <!-- TODO: include options --></p>
<h4 id="события-5">События</h4><p>События, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-events">Layer</a> <!-- TODO: include events --></p>
<p>События попапа, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-popup-events">Layer</a> <!-- TODO: include popup events --></p>
<h4 id="методы-5">Методы</h4><table id="dgcirclemarker-methods">
<thead>
<tr>
<th>Метод</th>
<th>Возвращает</th>
<th>Описание</th>
</tr>
</thead>
<tbody>
<tr id="circlemarker-togeojson">
<td><code><b>toGeoJSON</b>()</code></td>
<td><code>Object</code></td>
<td>Возвращает <a href="http://en.wikipedia.org/wiki/GeoJSON">GeoJSON</a> представление круглого маркера
(GeoJSON Point).</td>
</tr>
<tr id="circlemarker-setlatlng">
<td><code><b>setLatLng</b>(
<nobr><<a href="/doc/maps/ru/manual/basic-types#dglatlng">LatLng</a>> <i>latLng</i>)</nobr></code></td>
<td><code>this</code></td>
<td>Устанавливает географическую позицию круглого маркера.</td>
</tr>
<tr id="circlemarker-getlatlng">
<td><code><b>getLatLng</b>()</code></td>
<td><code><a href="/doc/maps/ru/manual/basic-types#dglatlng">LatLng</a></code></td>
<td>Возвращает текущую географическую позицию круглого маркера.</td>
</tr>
<tr id="circlemarker-setradius">
<td><code><b>setRadius</b>(<nobr><Number> <i>radius</i>)</nobr></code></td>
<td><code>this</code></td>
<td>Устанавливает радиус окружности, значение в пикселях.</td>
</tr>
<tr id="circlemarker-getradius">
<td><code><b>getRadius</b>()</code></td>
<td><code>Number</code></td>
<td>Возвращает текущее значение радиуса окружности.</td>
</tr>
</tbody>
</table>
<p>Методы, унаследованные от <a href="#dgpath-methods">Path</a> <!-- TODO: include methods --></p>
<p>Методы попапа, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-popup-methods">Layer</a> <!-- TODO: include methods --></p>
<p>Методы, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-methods">Layer</a> <!-- TODO: include methods --></p>
<p>Методы, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dgevented-methods">Evented</a> <!-- TODO: include methods --></p>
<h3 id="dgsvg">DG.Svg</h3><p>Данный класс позволяет отображать векторные слои с помощью <a href="https://developer.mozilla.org/docs/Web/SVG">SVG</a>.
Наследуется от <a href="/doc/maps/ru/manual/base-classes#dgrenderer">Renderer</a>.</p>
<p>Из-за <a href="http://caniuse.com/#search=svg">технических ограничений</a>, SVG доступен не во всех браузерах
(например, Android версий 2.x и 3.x не поддерживает SVG).</p>
<p>SVG не доступен в IE8, но в этом браузере есть поддержка устаревшей технологии
<a href="https://en.wikipedia.org/wiki/Vector_Markup_Language">VML</a>, и SVG renderer переключится на использование
VML, в случае работы под IE8. Поддержка VML в библиотеке существует только для обратной совместимости со старой версией
Internet Explorer.</p>
<h4 id="пример-использования-3">Пример использования</h4><p>Использование SVG по умолчанию для всех векторных объектов на карте:</p>
<pre><code>var map = DG.map("map", {
renderer: DG.svg();
});
</code></pre><p>Использование SVG rendrer с дополнительными отступами для определенных векторных объектов:</p>
<pre><code>var map = DG.map("map");
var myRenderer = DG.svg({ padding: 0.5 });
var line = DG.polyline( coordinates, { renderer: myRenderer } );
var circle = DG.circle( center, { renderer: myRenderer } );
</code></pre><h4 id="создание-4">Создание</h4><table>
<thead>
<tr>
<th>Конструктор</th>
<th>Описание</th>
</tr>
</thead>
<tbody>
<tr id="svg-dg-svg">
<td><code><b>DG.svg</b>(<nobr><SVG options> <i>options?</i>)</nobr></code></td>
<td>Создает SVG renderer, используя указанные опции.</td>
</tr>
</tbody>
</table>
<h4 id="опции-6">Опции</h4><p>Опции, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dgrenderer-options">Renderer</a> <!-- TODO: include options --></p>
<h4 id="события-6">События</h4><p>События, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-events">Layer</a> <!-- TODO: include events --></p>
<p>События попапа, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-popup-events">Layer</a> <!-- TODO: include popup events --></p>
<h4 id="методы-6">Методы</h4><p>Методы попапа, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-popup-methods">Layer</a> <!-- TODO: include methods --></p>
<p>Методы, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-methods">Layer</a> <!-- TODO: include methods --></p>
<p>Методы, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dgevented-methods">Evented</a> <!-- TODO: include methods --></p>
<h4 id="функции">Функции</h4><p>Есть несколько статических функций, которые могут быть вызваны без создания объекта DG.SVG:</p>
<table>
<thead>
<tr>
<th>Функция</th>
<th>Возвращает</th>
<th>Описание</th>
</tr>
</thead>
<tbody>
<tr id="svg-create">
<td><code><b>create</b>(<nobr><String> <i>name</i>)</nobr></code></td>
<td><code>SVGElement</code></td>
<td>Возвращает экземпляр <a href="https://developer.mozilla.org/docs/Web/API/SVGElement">SVGElement</a>,
соответствуйщий имени класса, переданному как аргумент. Например, использование 'line' вернет
экземпляр <a href="https://developer.mozilla.org/docs/Web/API/SVGLineElement">SVGLineElement</a>.</td>
</tr>
<tr id="svg-pointstopath">
<td><code>
<b>pointsToPath</b>(
<nobr><[]> <i>rings</i>,</nobr>
<nobr><Boolean> <i>closed</i>)</nobr>
</code></td>
<td><code>String</code></td>
<td>Генерирует строку SVG path для множества звеньев, каждое звено превращается
в "M..L..L.."-инструкции </td>
</tr>
</tbody>
</table>
<h3 id="dgcanvas">DG.Canvas</h3><p>Позволяет отрисовывать векторные слои с помощью <a href="https://developer.mozilla.org/docs/Web/API/Canvas_API">canvas</a>.
Наследуется от <a href="/doc/maps/ru/manual/base-classes#dgrenderer">Renderer</a>.
В виду <a href="http://caniuse.com/#search=canvas">технических ограничений</a>, Canvas доступен
не во всех браузерах (например, в IE8) и пересекающиеся объекты могут отображаться некорректно,
в некоторых крайних случаях.</p>
<h4 id="пример-использована">Пример использована</h4><p>Использование Canvas по умолчанию для всех векторных объектов на карте:</p>
<pre><code>var map = DG.map('map', {
renderer: DG.canvas();
});
</code></pre><p>Использование Canvas с дополнительными отступами, для определенных векторных объектов:</p>
<pre><code>var map = DG.map('map');
var myRenderer = DG.canvas({ padding: 0.5 });
var line = DG.polyline( coordinates, { renderer: myRenderer } );
var circle = DG.circle( center, { renderer: myRenderer } );
</code></pre><h4 id="создание-canvas">Создание Canvas</h4><table>
<thead>
<tr>
<th>Конструктор</th>
<th>Описание</th>
</tr>
</thead>
<tbody>
<tr id="canvas-dg-canvas">
<td><code><b>DG.canvas</b>(<nobr><Canvas options> <i>options?</i>)</nobr></code></td>
<td>Создает Canvas renderer, используя переданные опции.</td>
</tr>
</tbody>
</table>
<h4 id="опции-7">Опции</h4><p>Опции, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dgrenderer-options">Renderer</a> <!-- TODO: include options --></p>
<p>Опции, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-options">Layer</a> <!-- TODO: include options --></p>
<h4 id="события-7">События</h4><p>События, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-events">Layer</a> <!-- TODO: include events --></p>
<p>События попапа, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-popup-events">Layer</a> <!-- TODO: include popup events --></p>
<h4 id="методы-7">Методы</h4><p>Методы попапа, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-popup-methods">Layer</a> <!-- TODO: include methods --></p>
<p>Методы, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dglayer-methods">Layer</a> <!-- TODO: include methods --></p>
<p>Методы, унаследованные от <a href="/doc/maps/ru/manual/base-classes#dgevented-methods">Evented</a> <!-- TODO: include methods --></p>