Best jQuery Maps Plugins & Tutorials with Demo

Interactive 3D Mall Map with CSS & SVG

Interactive 3D Mall Map with CSS & SVG

Today we’d like to share a little 3D experiment with you. The idea is to show a mall map with all its floors in perspective. Additionally, we have a search in a sidebar that allows to filter mall spaces. Once a floor is selected, we show some pins as indicators for the different stores/spaces. When clicking on a pin, we show some more details of that space. We’ve mostly used CSS trickery for this, applying transitions that will rotate and move the levels by adding or removing classes. The levels are represented by inline SVGs.

Vizicities : 3D City and Data Visualisation Platform

Vizicities : 3D City and Data Visualisation Platform

ViziCities is a 3D city and data visualisation platform, powered by WebGL. Its purpose is to change the way you look at cities and the data contained within them.

ViziCities aims to combine data visualisation with a 3D representation of a city to provide a better understanding what’s going on. It’s a powerful new way of looking at and understanding urban areas.

Mapbox.js : JavaScript Mapping libraries

Mapbox.js : JavaScript Mapping libraries

MapBox.js is now version 1.0 and we are joining forces with Leaflet, one of the most established and robust open source mapping libraries. Embedding maps in web applications with MapBox.js is now even easier, and you can tap into powerful Leaflet features and multi-platform compatibility.

Geojson : Simple Editor for Map Data

Geojson : Simple Editor for Map Data

We are trying to make it easier to draw, change, and publish maps. Some of the most important geospatial data is the information we know, observe, and can draw on a napkin.

geojson.io aims to fix that. It’s an an open source project built with MapBox.js,

Gs Google Maps Directions

Gs Google Maps Directions

This is a light plugin that allows you to define maps, and gives you the option to display the directions between two points using Geolocation or a specific point. Also it has the options for searching a new route.

Animated Map Path for Interactive Storytelling

Animated Map Path for Interactive Storytelling

Today we’d like to share an experimental demo with you. This demo is an interactive map that will animate a map path while scrolling the page. The main idea is to connect the story being told with the path itself. The journey can also contain images that will indicate where they have been taken with a semi-transparent cone. It will appear as soon as the image is in the visible viewport.

Interactive Geographical Map with SVG and JavaScript

Interactive Geographical Map with SVG and JavaScript

I’ve demonstrated how SVG can be used to create responsive, scalable imagemaps, but have left the interactive part – aside from simple hover effects – largely unexplored, with a few exceptions. That changes with this article and the one following, which explore how to create a full, in-depth interface using SVG and JavaScript: in this case, a geographical map.

World Map Generator with SVG & jQuery

World Map Generator with SVG & jQuery

This WorldMapGenerator is jquey plugin for creates a Map using SVG. By this plugin user can select and get timezone value of selected area.It will create world map without image you need to write only one line and it will create your map using svg so it is responsive alos

Gmaps Animated Route

Gmaps Animated Route

Example of how to animate a route between two points in Google Maps.

MapIt : Easy way to Embed Google Maps

MapIt : Easy way to Embed Google Maps

An easy way to embed google maps in your site.

Features:

  • Customizable google maps (dimensions, zoom level, terrain type, etc)
  • Multiple markers with text and custom icons.
  • Routes
  • Events to handle markers and routes (show, show_all, hide, hide_all)


Best jQuery websites design awards