To develop a website to display details about the places around my house.
Create a Django admin interface.
Download your city map from Google.
Using <map>
tag name the map.
Create clickable regions in the image using <area>
tag.
Write HTML programs for all the regions identified.
Execute the programs and publish them.
map.html
<html>
<head>
<title>Map</title>
</head>
<body>
<h1 align="center">
<font color="red"><b>Mahindra World City</b></font>
</h1>
<h3 align="center">
<font color="blue"><b>Nithish Kumar P(212221040115)</b></font>
</h3>
<center>
<img src="map.png" usemap="#image-map">
<map name="image-map">
<area target="" alt="Infosys limited" title="Infosys limited" href="info.html" coords="1051,462,1185,519" shape="rect">
<area target="" alt="Toll Gate" title="Toll Gate" href="toll.html" coords="728,571,757,597" shape="rect">
<area target="" alt="BMW" title="BMW" href="bmw.html" coords="1081,542,1151,571" shape="rect">
<area target="" alt="Wabco" title="Wabco" href="wabco.html" coords="1262,499,46" shape="circle">
<area target="" alt="Renault Nissan" title="Renault Nissan" href="nissan.html" coords="1040,355,1120,404" shape="rect">
</map>
</center>
</body>
</html>
info.html
<html>
<head>
<title>Map</title>
</head>
<body bgcolor="purple">
<h1 align="center">
<font color="cyan"><b>Mahindra World City</b></font>
</h1>
<h3 align="center">
<font color="lime"></b>Infosys Private Limited</font>
</h3>
<hr size="3" color="red">
<p align="justify">
<font face="Georgia" size="5" color="white">
Infosys Limited is an Indian multinational information technology company that provides business consulting, information technology and outsourcing services.
The company was founded in Pune and is headquartered in Bangalore.
Infosys is the second-largest Indian IT company, after Tata Consultancy Services, by 2020 revenue figures
</font>
</p>
</body>
</html>
bmw.html
<html>
<head>
<title>Map</title>
</head>
<body bgcolor="orange">
<h1 align="center">
<font color="cyan"><b>Mahindra World City</b></font>
</h1>
<h3 align="center">
<font color="red"><b>BMW group Plant</b></font>
</h3>
<hr size="3" color="red">
<p align="justify">
<font face="Georgia" size="5" color="black">
BMW Group Plant Chennai started operations on 29 March 2007. BMW Group Plant Chennai locally produces 12 car models โ BMW 2 Series Gran Coupe, BMW 3 Series, BMW 3 Series Gran Turismo, BMW 5 Series, BMW 6 Series Gran Turismo, BMW 7 Series, BMW X1, BMW X3, BMW X4, BMW X5, BMW X7 and MINI Countryman.
</font>
</p>
</body>
</html>
nissan.html
<html>
<head>
<title>Map</title>
</head>
<body bgcolor="violet">
<h1 align="center">
<font color="cyan"><b>Mahindra World City</b></font>
</h1>
<h3 align="center">
<font color="green"><b>Renault Nissan of Technology</b></font>
</h3>
<hr size="3" color="yellow">
<p align="justify">
<font face="Georgia" size="5" color="black">
Nissan Motor Co. Ltd. is a Japanese multinational automobile manufacturer headquartered in Yokohama, Kanagawa, Japan.
The company sells its vehicles under the Nissan and Infiniti brands, and formerly the Datsun brand, with in-house performance tuning products (including cars) under the Nismo and Autech brands.
The company traces back to the beginnings of the 20th century, with the Nissan zaibatsu, now called Nissan Group.
</font>
</p>
</body>
</html>
toll.html
<html>
<head>
<title>Map</title>
</head>
<body bgcolor="sky blue">
<h1 align="center">
<font color="cyan"><b>Mahindra World City</b></font>
</h1>
<h3 align="center">
<font color="green"><b>Toll Gate</b></font>
</h3>
<hr size="3" color="yellow">
<p align="justify">
<font face="Georgia" size="5" color="black">
A toll road, also known as a turnpike or tollway or toll gate, is a public or private road (almost always a freeway in the present day) for which a fee (or toll) is assessed for passage. It is a form of road pricing typically implemented to help recoup the costs of road construction and maintenance.
Toll roads have existed in some form since antiquity, with tolls levied on passing travelers on foot, wagon, or horseback; a practice that continued with the automobile, and many modern tollways charge fees for motor vehicles exclusively. The amount of the toll usually varies by vehicle type, weight, or number of axles, with freight trucks often charged higher rates than cars
</font>
</p>
</body>
</html>
wabco.html
<html>
<head>
<title>Map</title>
</head>
<body bgcolor="yellow">
<h1 align="center">
<font color="cyan"><b>Mahindra World City</b></font>
</h1>
<h3 align="center">
<font color="green"><b>Wabco Private Limited</b></font>
</h3>
<hr size="3" color="red">
<p align="justify">
<font face="Georgia" size="5" color="black">
ZF holds a leading position in e-mobility, digitization as well as autonomous and networked driving in India.
ZF announced today that it has secured all required approvals for ZF Commercial Vehicle Control Systems India Limited to become the new name for WABCO India Limited.
</font>
</p>
</body>
</html>
The program for implementing image maps using HTML is executed successfully.