Bangluru City Tracker Project Report

7/28/2019 Bangluru City Tracker Project Report

http://slidepdf.com/reader/full/bangluru-city-tracker-project-report 1/29

SRNMN COLLEGE OF APPLIED SCIENCES

Shivamogga-577201

DEPARTMENT OF COMPUTER SCIENCE

Project Report On

BENGALURU CITY TRACKER

Submitted to KUVEMPU UNIVERSITY in the partial fulfillment of Bachelor of

computer application (BCA) degree in the academic year 2012-2013.

SUBMITTED BY

PAVAN.R BC100022

SANDESH.N.RAO BC100042

Under the guidance of

Mr. Pradeep.G.S. B.E,

Lecturer Dept. of CS

S.R.N.M.N. College

Shivamogga.

2012-13



SRNMN COLLEGE OF APPLIED SCIENCES

Shivamogga-577201

DEPARTMENT OF COMPUTERSCIENCE

CERTIFICATE

This is to certify that the project work entitled “BENGALURU CITY

TRACKER” carried out by PAVAN.R ,SANDESH.N.RAO students of VIth

semester, BCA, S.R.N.M.N.College of Applied Sciences, Shivamogga for the

partial fulfillment of the requirement for the award of Bachelor of Science degree

by “Kuvempu University” during the academic year 2012-2013.

Project Guide Head of the Department Principal

Mr.Pradeep.G.S., B.E Mrs.Y.M.Sujatha.,B.E.,M.C.A.,M.Phill Prof.R.K.Baliga.M.Sc

Date : Examiner:

Place: 1.

2.



ACKNOWLEDGEMENT

We express my deep sense of gratitude to Professor R K Baliga, Principal of SRNM College,

Shimoga for his encouragement and moral support throughout the course and valuable

Suggestion during the work.

We express special gratitude to Mrs Sujatha Y.M( Head of the Department,Computer science)

And Mr. Pradeep G.S, our project guide for their constant encouragement and

for valuable suggestion for the completion of my work, without whom, this project could

not have been completed.

We would like to thank all the Staff and non teaching staff of Computer Science of SRNM

College, Shimoga for their support and encouragement in the project.

We oblige to thank the SRNM College, Shimoga, Kuvempu University for providing opportunity

to study here and to carry out project work successfully.

Pavan.R

Sandesh.N.Rao



CONTENTS: Page No

1. Introduction



2. JavaScript Api V3

3. Module Description.

4. 4. Requirement Analysis

4.1. Hardware Requirements

4.2. Software Requirements

5. System Architecture

6.Coding

7. Screen Shots

8. Conclusion & Future Enhancements

Bibliography

1. INTRODUCTION



Banglore city is the capital of Indian state of Karnataka. Located on the Deccan plateau

in the south eastern part of Karnataka. Banglore is the India’s third most populous city and fifth

most populous urban agglomeration. Banglore is well known as a hub for India’s information

technology sector. It is among the top 10 preferred entrepreneurial locations in the world.

The visiting travelers need clear information about the places in the Banglore city. The

residents of this city need more information about the places for their day to day activities.

With this background, the current project aims at tracking information to finding the

distance between places in Banglore city.

Existing system:

The residents and travelers of the city are finding problems in getting information about

the locations of different places.

People are contacting friends, relatives and unknown persons for getting information.

People are wasting their time and money and sometimes are being cheated while getting proper

information.

Proposed system:

Proper information about places and required locations can be easily obtained by this

project.

Travelers and visitors can get the accurate information about various places and plan their

schedule.

2. JAVASCRIPT API V3 LANGUAGE:



JavaScript Api V3 is an interpreted computer programming language. It was originally

implemented as part of web browsers so that client-side scripts could interact with the user,

control the browser, communicate asynchronously, and alter the document content that was

displayed.

JavaScript is a prototype-based scripting language that is dynamic, weakly typed, and has first-

class functions. Its syntax was influenced by the language C. JavaScript copies many names and

naming conventions from Java, but the two languages are otherwise unrelated and have very

different semantics. The key design principles within JavaScript are taken from

the Self and Scheme programming languages. It is a multi-paradigm language,

supporting object-oriented, imperative, and functional programming styles.

JavaScript's use in applications outside of web pages—for example, in PDF documents, site-

specific browsers, and desktop widgets—is also significant. Newer and faster

JavaScript VMs and frameworks built upon them (notably Node.js) have also increased the

popularity of JavaScript for server-side web applications.

JavaScript was formalized in the ECMAScript language standard and is primarily used as part

of a web browser (client-side JavaScript). This enablesprogrammatic access to computational

objects within a host environment

The most common use of JavaScript is to write functions that are embedded in or included

from HTML pages and that interact with the Document Object Model (DOM) of the page.

Some simple examples of this usage are:

• Loading new page content or submitting data to the server via AJAX without reloading

the page (for example, a social network might allow the user to post status updates without

leaving the page)

• Animation of page elements, fading them in and out, resizing them, moving them, etc.

• Interactive content, for example games, and playing audio and video

• Validating input values of a web form to make sure that they are acceptable before

being submitted to the server.

• Transmitting information about the user's reading habits and browsing activities to

various websites. Web pages frequently do this for web analytics, ad

tracking, personalization or other purposes.

Because JavaScript code can run locally in a user's browser (rather than on a remote server), the

browser can respond to user actions quickly, making an application more responsive.

Furthermore, JavaScript code can detect user actions which HTML alone cannot, such as

individual keystrokes. Applications such as Gmail take advantage of this: much of the user-

interface logic is written in JavaScript, and JavaScript dispatches requests for information (such

as the content of an e-mail message) to the server. The wider trend of Ajax programming

similarly exploits this strength.

http://en.wikipedia.org/wiki/HTML


http://en.wikipedia.org/wiki/Document_Object_Model


http://en.wikipedia.org/wiki/AJAX

http://en.wikipedia.org/wiki/Data_validation

http://en.wikipedia.org/wiki/Form_(web)

http://en.wikipedia.org/wiki/Web_analytics


http://en.wikipedia.org/wiki/Ad_tracking


http://en.wikipedia.org/wiki/Personalization


http://en.wikipedia.org/wiki/Gmail


http://en.wikipedia.org/wiki/Ajax_(programming)



http://en.wikipedia.org/wiki/AJAX

http://en.wikipedia.org/wiki/Data_validation

http://en.wikipedia.org/wiki/Form_(web)










A JavaScript engine (also known as JavaScript interpreter or JavaScript implementation) is

an interpreter that interprets JavaScript source code and executes the script accordingly. The

first JavaScript engine was created by Brendan Eich at Netscape Communications Corporation,

for the Netscape Navigator web browser . The engine, code-named SpiderMonkey, is

implemented in C. It has since been updated (in JavaScript 1.5) to conform to ECMA-262

Edition 3. The Rhino engine, created primarily by Norris Boyd (formerly of Netscape; now atGoogle) is a JavaScript implementation in Java. Rhino, like SpiderMonkey, is ECMA-262

Edition 3 compliant.

A web browser is by far the most common host environment for JavaScript. Web browsers

typically create "host objects" to represent the Document Object Model (DOM) in JavaScript.

The web server is another common host environment. A JavaScript webserver would typically

expose host objects representing HTTP request and response objects, which a JavaScript

program could then interrogate and manipulate to dynamically generate web pages.

Because JavaScript is the only language that the most popular browsers share support for, it has

become a target language for many frameworks in other languages, even though JavaScript was

never intended to be such a language. Despite the performance limitations inherent to its

dynamic nature, the increasing speed of JavaScript engines has made the language a

surprisingly feasible compilation target.

This documentation is designed for people familiar with JavaScript programming and object-

oriented programming concepts. You should also be familiar with Google Maps from a user's point of view.

This conceptual documentation is designed to let you quickly start exploring and developing

applications with the Google Maps API. We also publish the Google Maps API Reference.

Obtaining an API Key

All Maps API applications* should load the Maps API using an API key. Using an API key

enables you to monitor your application's Maps API usage, and ensures that Google can contact

you about your application if necessary. If your application's Maps API usage exceeds theUsage Limits, you must load the Maps API using an API key in order to purchase additional

quota.

* Google Maps API for Business developers must not include a key in their requests. Please

refer to Loading the Google Maps JavaScript API for Business-specific instructions.

To create your API key:

1. Visit the APIs Console at https://code.google.com/apis/console and log in with your

Google Account.2. Click the Services link from the left-hand menu.

3. Activate the Google Maps API v3 service.

http://en.wikipedia.org/wiki/JavaScript_engine

http://en.wikipedia.org/wiki/Interpreter_(computing)


http://en.wikipedia.org/wiki/Source_code

http://en.wikipedia.org/wiki/Computer_program

http://en.wikipedia.org/wiki/Brendan_Eich



http://en.wikipedia.org/wiki/Netscape_Communications_Corporation

http://en.wikipedia.org/wiki/Netscape_Navigator

http://en.wikipedia.org/wiki/Web_browser



http://en.wikipedia.org/wiki/SpiderMonkey_(JavaScript_engine)


http://en.wikipedia.org/wiki/C_(programming_language)

http://en.wikipedia.org/wiki/Rhino_(JavaScript_engine)

http://en.wikipedia.org/wiki/Java_(programming_language)



http://en.wikipedia.org/wiki/Web_server

http://en.wikipedia.org/wiki/Server-side_JavaScript

http://en.wikipedia.org/wiki/HTTP


http://en.wikipedia.org/wiki/Target_language_(computing)


http://en.wikipedia.org/wiki/JavaScript_engine


http://en.wikipedia.org/wiki/Source_code

http://en.wikipedia.org/wiki/Computer_program


http://en.wikipedia.org/wiki/Netscape_Communications_Corporation

http://en.wikipedia.org/wiki/Netscape_Navigator



http://en.wikipedia.org/wiki/C_(programming_language)

http://en.wikipedia.org/wiki/Rhino_(JavaScript_engine)

http://en.wikipedia.org/wiki/Java_(programming_language)


http://en.wikipedia.org/wiki/Web_server

http://en.wikipedia.org/wiki/Server-side_JavaScript





4. Click the API Access link from the left-hand menu. Your API key is available from the

API Access page, in the Simple API Access section. Maps API applications use the

Key for browser apps.

By default, a key can be used on any site. We strongly recommend that you restrict the use of

your key to domains that you administer, to prevent use on unauthorized sites. You can specifywhich domains are allowed to use your API key by clicking the Edit allowed referrers... link

for your key..

Declaring Your Application as HTML5

We recommend that you declare a true DOCTYPE within your web application. Within the

examples here, we've declared our applications as HTML5 using the simple HTML5

DOCTYPE as shown below:

<!DOCTYPE html>

Most current browsers will render content that is declared with this DOCTYPE in "standardsmode" which means that your application should be more cross-browser compliant. The

DOCTYPE is also designed to degrade gracefully; browsers that don't understand it will ignore

it, and use "quirks mode" to display their content.

Note that some CSS that works within quirks mode is not valid in standards mode. In specific,

all percentage-based sizes must inherit from parent block elements, and if any of those

ancestors fail to specify a size, they are assumed to be sized at 0 x 0 pixels. For that reason, weinclude the following <style> declaration:

<style type="text/css">

html { height: 100% }

body { height: 100%; margin: 0; padding: 0 }

#map-canvas { height: 100% }</style>

This CSS declaration indicates that the map container <div> (named map-canvas) should take

up 100% of the height of the HTML body. Note that we must specifically declare those

percentages for <body> and <html> as well.

Loading the Google Maps API

<html><head>

<script type="text/javascript"

src="https://maps.googleapis.com/maps/api/js?



key=YOUR_API_KEY &sensor=SET_TO_TRUE_OR_FALSE ">

</script>

The URL contained in the script tag is the location of a JavaScript file that loads all of the

symbols and definitions you need for using the Google Maps API. This script tag is required.

The key parameter contains your application's API key. See Obtaining an API Key for more

information. Note that this key is not the same key as used with the v2 API, and must be

generated from the APIs console.

The sensor parameter of the URL must be included, and indicates whether this application usesa sensor (such as a GPS locator) to determine the user's location. We've left this example as a

variable set_to_true_or_false to emphasize that you must set this value to either true or false

explicitly.

Google Maps API for Business users should refer to Loading the Google Maps JavaScript API

in the Business documentation for important information about loading the Maps API in their applications.

HTTPS

If your application is an HTTPS application, you may instead wish to load the Google Maps

JavaScript API over HTTPS:

<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY &sensor=SET_TO_TRUE_OR_FALSE "

type="text/javascript"></script>

Loading the Maps API over HTTPS is necessary in SSL applications to avoid security warnings

in most browsers, and is recommended for applications that include sensitive user data, such asa user's location, in requests.

Libraries

When loading the JavaScript Maps API via the http://maps.googleapis.com/maps/api/js

URL, you may optionally load additional libraries through use of the libraries parameter.

Libraries are modules of code that provide additional functionality to the main JavaScript

API but are not loaded unless you specifically request them. For more information, see

Libraries in the V3 Maps API.



3. Module DescriptionIt has three modules, they are

1.START : In start module the source address is given by the user.

2.END : In end module the destination address is given by the user.

3.DISPLAY ROUTE : This module shows the distance between two places.



4. Hardware and Software requirement

4.1 Software requirements

• Language : Google maps Java Script ver. 3

• Operating system : Windows XP or Higher Version

• Browser : IE, Chrome and above.

4.2 Hardware requirements:

The minimum configuration required to run this project are:

1. Main Processor : Pentium IV & above

2. RAM : 512 MB

3. Hard disk : 40GB & above



5. SYSTEM ARCHITECTURE:

Java Script API V3

CLIENT/BROWSERINTERNET GOOGLE SERVER



6. CODING:

<script>

var directionDisplay;

var directionsService = new google.maps.DirectionsService();

function initialize() {

directionsDisplay = new google.maps.DirectionsRenderer();

var mapOptions = {

zoom: 20,

mapTypeId: google.maps.MapTypeId.ROADMAP,

center: new google.maps.LatLng(12.967674, 77.57651)

};

var map = new google.maps.Map(document.getElementById('map_canvas'),

mapOptions);

var input = document.getElementById('start_id');

// var autocomplete = new google.maps.places.Autocomplete(input);

var input1 = document.getElementById('dest_id');

input='Bangalore' + input + ', Bangalore';



input1='Bangalore' + input1 +',Bangalore';

//var autocomplete = new google.maps.places.Autocomplete(input1);

// autocomplete.bindTo('bounds', map);

var infowindow = new google.maps.InfoWindow();

var marker = new google.maps.Marker({

map: map

});

directionsDisplay.setMap(map);

directionsDisplay.setPanel(document.getElementById('directions-panel'));

var control = document.getElementById('control');

control.style.display = 'block';

map.controls[google.maps.ControlPosition.TOP].push(control);

}

function calcRoute() {

var start = document.getElementById('start_id').value;

var end = document.getElementById('dest_id').value;

var request = {



origin: start,

destination: end,

travelMode: google.maps.DirectionsTravelMode.DRIVING

};

directionsService.route(request, function(response, status) {

if (status == google.maps.DirectionsStatus.OK) {

directionsDisplay.setDirections(response);

var routes = response.routes[0];

// alert(routes.legs[0].distance.text);

}

});

}

google.maps.event.addDomListener(window, 'load', initialize);

</script>

</head>

<body>

<div id="control"> <strong>Start:</strong>

<input type="text" name="start_id" id="start_id"><br />



<strong>End:</strong>

<input type="text" name="dest_id" id="dest_id"><br/>

<input type="button" value="Display Route" onClick="calcRoute();">

</div>

<div id="map_canvas"></div>

<div id="directions-panel"></div>



7. SCREEN SHOTS





















8. CONCLUSION AND FUTURE ENHANCEMENT:

The current project will help in locating the distance between the places which will be

useful for the residents and travelers for the Banglore city.

After getting the directions we can add Images to a particular place.

Moreover, we can add extra markers to the map.

Also write a particular message on the marker.

Weather Reports of the city can be shown.



BIBLIOGRAPHY

www.google.com

www.wikipedia.com

Documents

Bangluru City Tracker Project Report