NigIMap is an interactive map of Nigeria that can be added to a web page.
- Can add pin to locate e.g capital
- Custom hoverable state content
- Custom On hover background color
- Clickable to set target location
- Change State Outline color
- Dynamic title, description for states
- URL links
- HTML tags for states description on hover
Initialize the necessary files:
<link rel="stylesheet" type="text/css" href="custom.min.css">
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="nigeria-min.js"></script>
- Simple initialization
NiMap('containerId');
- Advance initialization
NiMap(
'containerId',
{
config:[
{
state:1,
hover: "ABIA",
url: "#",
target: "same_window",
upColor: "#FFFFF3",
overColor: "#ECFFB3",
downColor: "#cae9af",
}
],
pins_config:[
{
state:1,
shape: "square",
hover: "<b><u>Abia</u></b><br>Write any text and load images<br><img src='assets/example.png'>",
x: 300,
y: 308,
size: 18,
outline: "#000080",
upColor: "#1a1aff",
overColor: "#66d9ff",
url: "#",
target: "new_window",
}
],
});
The state in the configuration is the map's state number. Every state has a number. A state is required in order to use a configuration.\
The pins config function adds an extra layer to a state. The only required value in any configuration is state.
-
1.Abia
-
2.Adamawa
-
3.Akwa Ibom
-
4.Anambra
-
5.Bauchi
-
6.Bayelsa
-
7.Benue
-
8.Borno
-
9.River
-
10.Delta
-
11.Ebonyi
-
12.Edo
-
13.Ekiti
-
14.Enugu
-
15.Gombe
-
16.Imo
-
17.Jigawa
-
18.Kaduna
-
19.Kano
-
20.Katsina
-
21.Kebbi
-
22.Kogi
-
23.Kwara
-
24.Lagos
-
25.Nasarawa
-
26.Niger
-
27.Ogun
-
28.Ondo
-
29.Osun
-
30.Oyo
-
31.Plateau
-
32.Rivers
-
33.Sokoto
-
34.Taraba
-
35.Yobe
-
36.Zamfara
-
37.Abuja