Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →

mapsapi-freet

Package Overview

Dependencies

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

mapsapi-freet

Heatmap module for API Yandex.Maps

0.0.1
latest
Source
npm

Version published: 3 years ago

Weekly downloads: 4; decreased by-80%

Maintainers: 1

Weekly downloads

Created: 3 years ago

Source

Yandex Maps API Heatmap Module

Heatmap is a graphical representation of some spatial data where density values are indicated with different colors. Heatmap class allows to construct and display such representations over geographical maps.

Loading

Load both Yandex Maps JS API 2.1 and module source code by adding following code into <head> section of your page
```
<script src="http://api-maps.yandex.ru/2.1/?lang=ru_RU" type="text/javascript"></script>

<script src="https://yastatic.net/s3/mapsapi-jslibs/heatmap/0.0.1/heatmap.min.js" type="text/javascript"></script>
```

Get access to module functions by using ymaps.modules.require method

ymaps.modules.require(['Heatmap'], function (Heatmap) {
     var heatmap = new Heatmap();
});

Heatmap constructor

Parameter	Default value	Decription
data	-	Type: Object. Points described using of following formats: Number[][] - coordinates array; IGeoObject - object implementing `IGeoObject` interface; IGeoObject[] - array of objects implementing `IGeoObject` interface; ICollection - collection of objects implementing `IGeoObject` interface; ICollection[] - array of collection of objects implementing `IGeoObject` interface; GeoQueryResult - result of geoQuery execution; Any - JSON representation of data according to GeoQueryResult input data format.
options	-	Type: Object. Heatmap representation options.
options.radius	10	Type: Number. Point radius of influence (px).
options.dissipating	false	Type: Boolean. `true` - disperse points on higher zoom levels according to radius, `false` - don't disperse.
options.opacity	0.8	Type: Number. Heatmap opacity (from 0 to 1).
options.intensityOfMidpoint	0.2	Type: Number. Intensity of median point (from 0 to 1).
options.gradient	{ 0.1: 'rgba(128, 255, 0, 0.7)', 0.2: 'rgba(255, 255, 0, 0.8)', 0.7: 'rgba(234, 72, 58, 0.9)', 1.0: 'rgba(162, 36, 25, 1)' }	Type: Object. JSON description of gradient.

Properties

Name	Type	Description
options	option.Manager	`Heatmap` instance options manager.

Methods

Name	Returns	Description
getData	Object \| null	Returns reference to data provided to constructor or setData method.
setData	Heatmap	Adds new points. If `Heatmap` instance is already rendered, it will be re-rendered.
getMap	Map \| null	Returns reference to Map object.
setMap	Heatmap	Sets Map instance to render heatmap layer over it.
destroy	-	Destroys `Heatmap` instance.

getData

Returns:

reference to data provided to constructor or setData method.

setData

Sets points. If Heatmap instance is already rendered, it will be re-rendered.

Returns:

Self-reference.

Parameters:

Parameter	Default value	Description
data	-	Type: Object. Points descibed using one of following formats: Number[][] - coordinates array; IGeoObject - object implementing `IGeoObject` interface; IGeoObject[] - array of objects implementing `IGeoObject` interface; ICollection - collection of objects imlementing `IGeoObject` interface; ICollection[] - array of collection of objects implementing `IGeoObject` interface; GeoQueryResult - result of geoQuery execution; Any - JSON representation of data according to GeoQueryResult input data format.

getMap

Returns:

reference to Map object.

setMap

Sets Map instance to render Heatmap object over it.

Returns:

self-reference.

Parameters:

Parameter	Default value	Description
map	-	Type:Map Map instance to render `Heatmap` object over it.

destroy

Destroys Heatmap instance

Examples

Displaying heatmap over geographical map:

ymaps.modules.require(['Heatmap'], function (Heatmap) {
     var data = [[37.782551, -122.445368], [37.782745, -122.444586]],
         heatmap = new Heatmap(data);
     heatmap.setMap(myMap);
});

ymaps.modules.require(['Heatmap'], function (Heatmap) {
     var data = {
              type: 'FeatureCollection',
              features: [{
                  id: 'id1',
                  type: 'Feature',
                  geometry: {
                      type: 'Point',
                      coordinates: [37.782551, -122.445368]
                  }
              }, {
                  id: 'id2',
                  type: 'Feature',
                  geometry: {
                      type: 'Point',
                      coordinates: [37.782745, -122.444586]
                  }
              }]
          },
         heatmap = new Heatmap(data);
     heatmap.setMap(myMap);
});

Updating heatmap data:

ymaps.modules.require(['Heatmap'], function (Heatmap) {
    var data = [[37.782551, -122.445368], [37.782745, -122.444586]],
        heatmap = new Heatmap(data);
    heatmap.setMap(myMap);

    var newData = [[37.774546, -122.433523], [37.784546, -122.433523]];
    heatmap.setData(newData);
});

Changing heatmap representation options.

ymaps.modules.require(['Heatmap'], function (Heatmap) {
    var data = [[37.782551, -122.445368], [37.782745, -122.444586]],
        heatmap = new Heatmap(data);
    // Heatmap becomes opaque
    heatmap.options.set('opacity', 1);
    heatmap.setMap(myMap);
});

ymaps.modules.require(['Heatmap'], function (Heatmap) {
    var data = [[37.782551, -122.445368], [37.782745, -122.444586]],
        heatmap = new Heatmap(data);
    // Changing gradient
    heatmap.options.set('gradient', {
        '0.1': 'lime',
        '0.9': 'red'
    });
    heatmap.setMap(myMap);
});

Weighted points.

ymaps.modules.require(['Heatmap'], function (Heatmap) {
    var data = {
              type: 'FeatureCollection',
              features: [{
                  id: 'id1',
                  type: 'Feature',
                  geometry: {
                      type: 'Point',
                      coordinates: [37.782551, -122.445368]
                  },
                  properties: {
                      weight: 1
                  }
              }, {
                  id: 'id2',
                  type: 'Feature',
                  geometry: {
                      type: 'Point',
                      coordinates: [37.782745, -122.444586]
                  },
                  properties: {
                      weight: 10
                  }
              }]
          },
        heatmap = new Heatmap(data);
    heatmap.setMap(myMap);
});

Demo

Keywords

FAQs

What is mapsapi-freet?

Is mapsapi-freet popular?

Is mapsapi-freet well maintained?

Package last updated on 07 Nov 2021

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

mapsapi-freet

Yandex Maps API Heatmap Module

Loading

Heatmap constructor

Properties

Methods

getData

Returns:

setData

Returns:

Parameters:

getMap

Returns:

setMap

Returns:

Parameters:

destroy

Examples

Keywords

Related posts

Typosquatting Cryptographic Libraries: Malicious npm Packages Threaten Crypto Developers with Keylogging and Wallet Theft

Weekly Downloads Now Available in npm Package Search Results