---
metadata:
- name: generator
content: Diplodoc Platform v5.39.1
alternate:
- https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/examples/cases/polyline.md
- https://yandex.com.tr/dev/jsapi-v2-1/doc/ru/v2-1/examples/cases/polyline.md
---
> **Documentation Index:** Fetch the complete configuration index at https://yandex.com.tr/dev/jsapi-v2-1/doc/en/llms.txt
# Polyline
Open in CodeSandbox
A polyline is a shape consisting of a set of sequentially connected vertices. The polyline can have self-intersections.
The polyline can be created in two ways: using the GeoObject
class with the "Polyline" geometry type,
or using the Polyline auxiliary class.
When creating a polyline, you can set properties
(such as the contents of a balloon or hint) and
options (such as color and line width).
Polylines, like other geo objects, can be combined in collections.
{% list tabs %}
- index.html
```html
Examples. Polylines
```
- polyline.js
```js
ymaps.ready(init);
function init() {
// Creating the map.
var myMap = new ymaps.Map(
"map",
{
center: [55.72, 37.44],
zoom: 10,
},
{
searchControlProvider: "yandex#search",
}
);
// Creating a polyline using the GeoObject class.
var myGeoObject = new ymaps.GeoObject(
{
// Describing the geometry of the geo object.
geometry: {
// The "Polyline" geometry type.
type: "LineString",
// Specifying the coordinates of the vertices of the polyline.
coordinates: [
[55.8, 37.5],
[55.7, 37.4],
],
},
// Defining properties of the geo object.
properties: {
// The contents of the hint.
hintContent: "I'm a geo object",
// The contents of the balloon.
balloonContent: "You can drag me",
},
},
{
/**
* Setting the geo object options.
* Enabling drag-n-drop for the polyline.
*/
draggable: true,
// The line color.
strokeColor: "#FFFF00",
// Line width.
strokeWidth: 5,
}
);
// Creating a polyline using the Polyline auxiliary class.
var myPolyline = new ymaps.Polyline(
[
// Specifying the coordinates of the vertices of the polyline.
[55.8, 37.5],
[55.8, 37.4],
[55.7, 37.5],
[55.7, 37.4],
],
{
/**
* Describing the properties of the geo object.
* The contents of the balloon.
*/
balloonContent: "Polyline",
},
{
/**
* Setting options for the geo object. Disabling the close button on a balloon.
*
*/
balloonCloseButton: false,
// The line color.
strokeColor: "#000000",
// Line width.
strokeWidth: 4,
// The transparency coefficient.
strokeOpacity: 0.5,
}
);
// Adding lines to the map.
myMap.geoObjects.add(myGeoObject).add(myPolyline);
}
```
{% endlist %}