Using OpenLayers To add Animation

To know what openlayers is click here . OpenLayers is better than leaflet if you want to customize your map and make it more interactive.

Add Animation To maps:

view.animate() is used to add one or more animations. For a example of adding animation click here.

Here if you want to give your cities, just replace london to city you want to add. After replacing london with your city change longitude and latitude in line :

 var london = ol.proj.fromLonLat([-0.12755, 51.507222]);

Here enter your cities longitude and latitude. Also, change the zoom level according to your requirement.

My Output:


Here, I have used zoom level 16 and longitude and latitude of my college and P.A.U. and nearby area.

If you want to take screenshot and use LUbuntu install scrot and use command :

 scrot -e 'mv $f ~/Pictures/screenshots'

To add Flight Animation:

Flight Example will provide you example to learn about Flight Animation. Just change the area you want to view,change the areas longitude and latitude and zoom level.

 target: 'map',
 view: new ol.View({
 center: ol.proj.fromLonLat([78.9629, 20.5937]),
 zoom: 12



Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s