All Projects → Viglino → OL3-AnimatedCluster

Viglino / OL3-AnimatedCluster

Licence: other
OL3-AnimatedCluster is now part of the ol-ext project

Programming Languages

javascript
184084 projects - #8 most used programming language
HTML
75241 projects
CSS
56736 projects

Projects that are alternatives of or similar to OL3-AnimatedCluster

Openlayers
OpenLayers
Stars: ✭ 8,612 (+13149.23%)
Mutual labels:  maps, openlayers
Ol Ext
Cool extensions for Openlayers (ol) - animated clusters, CSS popup, Font Awesome symbol renderer, charts for statistical map (pie/bar), layer switcher, wikipedia layer, animations, canvas filters.
Stars: ✭ 706 (+986.15%)
Mutual labels:  maps, openlayers
tailormap
B3partners Tailormap repository
Stars: ✭ 26 (-60%)
Mutual labels:  maps, openlayers
rlayers
React Component Library for OpenLayers
Stars: ✭ 98 (+50.77%)
Mutual labels:  maps, openlayers
Mapstore2
Modern webmapping with OpenLayers, Leaflet and React
Stars: ✭ 251 (+286.15%)
Mutual labels:  maps, openlayers
Gwt Ol
GWT wrapper for OpenLayers 3+ using JSInterop
Stars: ✭ 57 (-12.31%)
Mutual labels:  maps, openlayers
Prunecluster
Fast and realtime marker clustering for Leaflet
Stars: ✭ 473 (+627.69%)
Mutual labels:  maps, cluster
Ol Games
🎮 Game stuff for Openlayers, powered by HTML5, canvas, javascript and Openlayers.
Stars: ✭ 61 (-6.15%)
Mutual labels:  maps, openlayers
hslayers-ng
User interface and map building extensions for OpenLayers
Stars: ✭ 29 (-55.38%)
Mutual labels:  maps, openlayers
react-map-gl-cluster
Urbica React Cluster Component for Mapbox GL JS
Stars: ✭ 27 (-58.46%)
Mutual labels:  maps, cluster
Google-Maps-Direction
Google Maps Direction
Stars: ✭ 38 (-41.54%)
Mutual labels:  maps
crisis-news-mapper
日本の災害関連ニュースをTwitterから収集して地図上にマッピングするFirebaseプロジェクト crisis.yuiseki.net
Stars: ✭ 13 (-80%)
Mutual labels:  maps
HealthCare-Scan-Nearby-Hospital-Locations
I developed this android application to help beginner developers to know how to use Google Maps API and how to convert JSON data into Java Object.
Stars: ✭ 23 (-64.62%)
Mutual labels:  maps
inspr
Inspr is an agnostic application mesh for simpler, faster, and securer development of distributed applications (dApps).
Stars: ✭ 49 (-24.62%)
Mutual labels:  cluster
vallang
Generic immutable recursive data representation API targeted at source code models and more.
Stars: ✭ 28 (-56.92%)
Mutual labels:  maps
lagopus
Distributed fuzzing platform
Stars: ✭ 28 (-56.92%)
Mutual labels:  cluster
Samples-NET.Core-MVC-CSharp
ASP.NET Core 2.0 MVC C# samples for Stimulsoft Reports.Web reporting tool.
Stars: ✭ 28 (-56.92%)
Mutual labels:  maps
dentist
Close assembly gaps using long-reads at high accuracy.
Stars: ✭ 39 (-40%)
Mutual labels:  cluster
django-graphql-geojson
GeoJSON support for Graphene Django
Stars: ✭ 61 (-6.15%)
Mutual labels:  maps
NodeServer
Compare node.js servers
Stars: ✭ 35 (-46.15%)
Mutual labels:  cluster

OL3-AnimatedCluster

[DEPRECATED] OL3-AnimatedCluster is now part of the ol-ext project and is now available on NPM.

A cluster layer for OpenLayers (ol3/ol4) that animates clusters on zoom change and a select interaction that spread out cluster to allow feature selection in it.

Inspired by acanimal/AnimatedCluster.

View the live example...

If you like this, you may like ol3-ext.

How it runs?

ol.layer.AnimatedCluster is a layer that animates clusters on zoom change. The layer is created with an ol.source.Cluster as standard cluster vector layers.

ol.interaction.SelectCluster is a select interaction that handles clusters. On select cluster springs apart to reveal the features. The revealed features are themselves selectable. Revealed features are a cluster with an attribute features that contain the original feature so they can be use as a cluster.

##Usage

Include the following files in your page:

<script type="text/javascript" src="https://cdn.rawgit.com/Viglino/OL3-AnimatedCluster/gh-pages/interaction/selectclusterinteraction.js"></script>
<script type="text/javascript" src="https://cdn.rawgit.com/Viglino/OL3-AnimatedCluster/gh-pages/layer/animatedclusterlayer.js"></script>

Create a cluster layer to add to the map object:

// Cluster Source
var clusterSource = new ol.source.Cluster({
     distance: 40,
     source: new ol.source.Vector()
	});
// Animated cluster layer
var clusterLayer = new ol.layer.AnimatedCluster(
	{	name: 'Cluster',
		source: clusterSource,
		// Use a style function for cluster symbolisation
		style: getStyle
	});
// Add the layer to the map
map.addLayer(clusterLayer);

The getStyle function will customize the clusters symbolisation.

Look at the standard OL3 cluster example or the repo example to know how to define such a function.

Licence

OL3-ext is licenced under the French Opensource BSD compatible CeCILL-B FREE SOFTWARE LICENSE.
(c) 2016 - Jean-Marc Viglino

Full text license in English: (http://www.cecill.info/licences/Licence_CeCILL-B_V1-en.txt)
Full text license in French: (http://www.cecill.info/licences/Licence_CeCILL-B_V1-fr.txt)

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].