29/3 End of Research

GAH not much work done today, but the bright side? I actually did something worth paying me for (actually helping people with stuff at work). This posting is just to go over what i achieved by the end of the milstone vs. what i was aiming to achieve, it wont be too in depth, but i will finish with a conclusion that will hopefully conclude well enough. I will also show examples (mainly code) of exactly what it was that has been learnt. First i'll just cover the milestone again :

1. Have an overall idea on how to use Google maps API (Creating maps, Creating Routes – point to point, Google maps implementation in ASP.NET, Adding points to routes)
2. Learn basics of JavaScript (Working with HTML, Arrays, General)
3. Learn basics of C# (Basics of syntax, after this I should be fine as I’ve programmed VB.NET)

_________________________________________________

1 Google maps basics

So basically what i wanted to do here was know enough to be able to easily implement everything when it came to the implementation stage. Which will include things like actually knowing how to:

1.1 Showing a map and centering it
1.2 Adding polylines
1.3 Adding G G G markers
1.4 Listeners
1.5 Adding routes & geocoding
1.6 Google maps & ASP.NET

------------------------------------------
1.1 Showing a map and centering it

OK so this is easy basically all you have to do (besides adding the key to the javascript at the top) is add a few lines of code to show a map. This goes under function load().

map = new GMap2(document.getElementById("map"));
var startHere = new GLatLng(-41.28077355890163, 173.2734489440918);
map.setCenter(startHere, 13);

------------------------------------------
1.2 Adding polylines

This is a very simple example of adding a new line based on an array created by the user and added to an array. Every time a user clicks the map those coordinates will be added to an array, and if the array length is more than one, this polyline will be drawn on the map.

points.push(point);
if (points.length > 1) {
route = new GPolyline(points);
map.addOverlay(route);
}

------------------------------------------
1.3 Adding G G G markers

This is very simple, all you need is the point where you want the marker to go. Create a new marker, assign it a value and add the overlay.

marker = new GMarker(lcPoint);
map.addOverlay(marker);

------------------------------------------
1.4 Listeners

Using the GEvent.assListener funtion you can add listeners for things such as a map click, or map drag, a map error etc. This is declared in the funtion load() part at the start of the page.

GEvent.addListener(map, 'click', addMarkerPoint);
GEvent.addListener(gdir, "error", handleErrors);

------------------------------------------
1.5 Adding routes & geocoding

The following code assigns a place to put the information, then creates a new gdirections object, then a new geocoder is created, gets the locations, assigns the response to a variable, then gets the specific lat and long coordinates. This can then be added to an array and with the next code you can throw either addresses or coordinates at, and it will get the route for this.

//declare directions objects etc
directionsPanel = document.getElementById("route");
directions = new GDirections(map, directionsPanel);

//create geocoder and get locations, place those into an array.
geocoder = new GClientGeocoder();
geocoder.getLocations(address);
place = response.Placemark[0];

//get the geocoding data
point = new GLatLng(place.Point.coordinates[1],
place.Point.coordinates[0]);
-------------
//load directions
directions.loadFromWaypoints([lcFromAddress, lcToAddress, lcEndAddress])

Another way of getting the coordinates is from the map point listener. Below listens for the use to click, then passes that point to a funtion which adds this point to an array. This can then be accessed and used for creating routes, polylines, g markers etc etc.

GEvent.addListener(map, 'click', addMarkerPoint);

function addMarkerPoint(marker, point) {
points.push(point);
setRoute();
}

------------------------------------------
1.6 Google maps & ASP.NET

AHHHHH now this i did not completely finish :( I got alot of looking at code etc done, but nothing practical. Only thing i missed in milestone. BUT as i have allocated 3 hours per week still on research and was going to use that time to carry on with more C#, i can just practise C# implementing google maps, make sense? Will talk about this more further on.

2 Basics of javascript

2.1 Basics
2.2 Variables
2.3 Loops and if statements
2.3 Arrays
2.4 Functions

------------------------------------------
2.1 Basics

I just wanted to put the real simple stuff here. Javacript usualy goes in the head part of the html document and is declared as shown below.

Inside the script area is where you add all of your functions and global variables. The best practise that i have seen for javascript is the same as other languages, such as where to put things, how to lay code out, and how to name variables.

------------------------------------------
2.2 Variables

The variables in javascript are loosely typed, which means we do not have to define what type they are. Below shows how to declare a variable and sign a value to this. If the variable is declared outside a function in the main script area this is a global variable and can be accessed from anywhere.

var lcCount;
lcCount = 0;

------------------------------------------
2.3 Loops and if statements

If statements are pretty simple, below is an example.

var meh;
meh = 5 + 5;

if (meh == 8) {
alert ("Nope");
}
else if (meh == 10){
alert("Yes!");
}


Loops: for, while, do while. I'll just go over one, basically these are used to execute one part of code a specified number of times.

for (var i=0;i<5;i++)>

------------------------------------------
2.4 Arrays

Arrays are easy, pretty much like a variable, but it holds many values. I did not go into multidimentional arrays so this is just basic arrays. Below is an example showing how to declare an array, how to add values, and how to read these out.

var points = [];

for (var i=0;i<5;i++)>

alert(points);

------------------------------------------
2.5 Functions

Functions hold seperate parts of code to do a specific task, below is an example of a function that is called to do a certain job.

points[];

function load(){
var valueOne = 12343;
addToArray(valueOne);
}

function addToArray(valueOne) {
points.push(valueOne);
}

3 C# basics

I'm still reading through my book on C#. So far i have looked at the basics of syntax and have gauged the idea that it is quite different from VB.NET. As mentioned earlier, because i have not done any implementation on C# i will put aside 3 hours a week to do this (maybe some other non project time also) of my specified research time. And because i did not complete the google maps in C# bit i will obviously combine this. I will make a seperate post for my progress on this specific task and link it from the side menu.

Conclusion

So how far did i get? I am going to say i reached 95% of my milestone and are going to have to catch up on that 5% in my specified research times. I think that i could have done much better in this part of the project, however i am having problems with time management, this i am going to try very hard to improve in the design faze which is starting on monday. Knowledge wise i have learnt enough to be able to design and know what i can do. Also i can start thinking about implementation.