Interactive Map of Italy -- Clickable Regions and Clickable Pins

Buy Now $17

Custom SVG Map of Italy -- Personalizzato SVG Mappa d'Italia

Clickable Regions and Clickable Pins -- Regioni cliccabili e cliccabili Pins

This Italy map template allows you to create your own custom interactive map and modify colors, links, hover description. also to add unlimited number of clickable pins anywhere on the map then embed it in your website and link each clickable region or pin to any webpage. The map is SVG based so it's responsive and fully resizable and mobile friendly.

Traduzione: Questo modello di mappa Italia permette di creare il proprio personalizzato mappa interattiva e modificare i colori , link , descrizione hover . anche di aggiungere un numero illimitato di pin cliccabili qualsiasi punto della mappa poi incorporare nel tuo sito web e collegare ogni zona cliccabile o pin a qualsiasi pagina web . La mappa è in formato SVG basa quindi è reattivo e completamente ridimensionabile e mobile friendly

Features of the Map

  • Easily customized and NO Javascript knowledge required.
  • SVG (Scalable Vector Graphics) based, so it can be enlarged as much as you want while preserving the quality.
  • Works perfectly on desktop along with mobile devices including Smartphones: iPhone, iPad, Tablets, etc.
  • Responsive and fully resizable.
  • Can be used as interactive regional map of Italy or a blank map with clickable pins or both as in the demo.
  • Each region or pin can be linked to any webpage.
  • Each region can be activated/deactivated.
  • Each pin can be customized individually (shape, position, colors, hover content, URL, etc).
  • Easily customized through simple JavaScript files ( NO Javascript knowledge required ).
  • Not a WordPress plugin but can be integrated in WordPress website using HTML Snippets plugin. A step by step installation guide is included in the documentation files.
  • 100% hand drawn SVG anchor by anchor in Adobe Illustrator for highest quality and best optimization.
    Note: We can customize the map for your own needs (private work).
  • Small file size > Faster load speed > Better for SEO and Google ranking.
  • Compatible with all major browsers including Google Chrome, Firefox, IE9+, Safari and Opera.
  • Full documentation is included. and an interactive X, Y coordinates guide is included (Similar to this).

Traduzione: Caratteristiche della Carta

  • Facilmente personalizzato e la conoscenza NO necessario Javascript.
  • SVG ( Scalable Vector Graphics ) basato , in modo che possa essere ampliata tanto quanto si vuole , preservando la qualità.
  • Funziona perfettamente sul desktop con i dispositivi mobili, tra cui Smartphone: iPhone, iPad , tablet, ecc.
  • Reattivo e completamente ridimensionabile.
  • Può essere usato come mappa regionale interattiva di Italia o di una mappa muta con perni cliccabili o entrambi , come nella demo .
  • Ogni regione o il pin può essere collegato a qualsiasi sito.
  • Ogni regione può essere attivata / disattivata .
  • Ogni pin può essere personalizzato individualmente ( forma, posizione,i colori ,i contenuti hover, URL, ecc).
  • Facilmente integrabile con WordPress utilizzando HTML Snippets plugin. Una guida passo per passo è incluso nel file di documentazione.
  • 100 % disegnata a mano in formato SVG ancoraggio ancoraggio in Adobe Illustrator per la massima qualità e migliore ottimizzazione.
    Nota: Siamo in grado di personalizzare la mappa per le proprie esigenze (lavoro privato).
  • Piccolo peso del file > Maggiore velocità di carico > Meglio per SEO e ranking di Google .
  • Compatibile con tutti i principali browser tra cui Google Chrome, Firefox , IE9 + , Safari e Opera.
  • La documentazione completa è inclusa . e una X interattivo , coordinate Y guida è inclusa (Simile a questo).

General Map Style / Generale Mappa Style

borderColor:
colors of the borders between the regions (colori dei confini tra le regioni).
mapShadow:
shadow below the map (ombra sotto la mappa).
shadowOpacity:
shadow opacity, value, 0-100 (ombra opacità, il valore , 0-100).
hoverShadow:
shadow below the hover popup (ombra sotto il popup hover).

Per Region Parameters / Per Parametri Regione

hover:
region hover content (regione contenuti hover).
url:
link it to any webpage (collegarlo a qualsiasi pagina web).
target:
open it in the "same window", "new window" or "none" (aprirlo nella "stessa finestra" , "nuova finestra" o "nessuna").
Trick: Using 'none' is very useful if you have enough content in the hover popup and you don't want to link this region to other pages.
upColor:
region's color when page loads (colore quando caricamento della pagina della regione).
overColor:
region's color when mouse hover (colore quando passaggio del mouse della regione).
downColor:
region's color when mouse clicking (colore quando click del mouse di regione).
enable:
true/false to enable/disable this region (true / false per attivare / disattivare questa regione).

Push Pin Parameters / Spingere Parametri Pin

Each pin has the following parameters:

shape:
choose the shape of the pin;"circle" or "rectangle" ("cerchio" o "rettangolo").
hover:
the content of the hover popup (il contenuto del popup hover).
Note: the hover popup expands with content but it’s not responsive so don’t put much content to avoid any conflict with small devices.
pos_X:
location of the pin on X axis (posizione del perno sull'asse X).(How?)
pos_Y:
location of the pin on Y axis (posizione del perno sull'asse Y).(How?)
width:
width of the rectangle (larghezza del rettangolo).
height:
height of the rectangle (altezza del rettangolo).
diameter:
diameter of the circle (diametro del cerchio).
outline:
outline color of the pin (colore del contorno del perno).
thickness:
thickness of the line (spessore della linea).
upColor:
color of the pin when map loads (colore dei pin quando mappa carichi).
overColor:
color of the pin when mouse hover (colore del perno quando il mouse hover).
downColor:
color of the pin when clicked (colore del perno quando si fa clic).
url:
URL assigned for this pin (URL assegnato per questo pin).
target:
open it in the "same window", "new window" or "none" (aprirlo nella "stessa finestra" , "nuova finestra" o "nessuna").
Trick: Using 'none' is very useful if you have enough content in the hover popup and you don't want to link this pin to other pages).
enable:
true/false to enable/disable this pin. in case you want to put inactive pins or temporary disable any of them (true / false per attivare / disattivare questo pin . nel caso in cui si desidera inserire perni inattive o disabilitare temporaneamente uno di essi).
Buy Now $17

FAQ

How to embed this interactive map of Italy in my website?

The purchased file includes a detailed documentation. But simply upload all the purchased map files including the Javascript and the CSS files to your server, and copy the HTML code from the map.html file and paste it into your website anywhere you want to place the map.

How to insert this map in a WordPress site?

There are 2 simple methods to insert the map in your WordPress site, either using HTML snippet plugin, a step by step guide is included in the downloaded file. Also you can use iframe plugin to embed the map in your wp site.

Is this map resizable?

Yes, the map is responsive and fully resizable and you can adjust the map size as you want simply through the included map-style.css file .

How to add/remove markers on the map?

You can do that by copy/paste of the default code in the included files, then adjust colors, content, links ..etc of each pin.

How to get the X, Y coordinate of pins on the map?

The purchased files includes an interactive guide that helps you to get the accurate coordinates on the map, all what you need to do is to click anywhere on the map guide to get the X, Y coordinate values and use it in your map. You can see this video screencast to see how it works.

Does this map work on iPhone and iPad?

Yes. It works on smartphones: iPhone and iPad, etc

Are you available for freelance work?

Yes, we can make a map customization or create a custom map for you from scratch on a freelance basis.

COPYRIGHT © All rights reserved to HTML5InteractiveMaps.com - Art101