< Previous Tutorial Adding a basic Map
LIVE DEMO | SOURCE
We are going to start off with the same code base of the last the Tutorial but this time we want to add a specific map to the page instead of the random map. There are actually several ways to do this but for his situation we are going to do it using a lat and longitude. The first thing we need to do is get the latitude and longitude for the place that we want to have the map centered on. There are several way to do this but for now i just typed in "lat long for los angeles" and it returned this to me.
34.0° N - 118.2° W
So we are going to be taking this Lat long and use it to modify the existing LoadMap() function. As you can see below we are going to new up a VELatLong object and pass in the lattitude and longitude to its constructor.
map.LoadMap(new VELatLong(34.0, -118.2));
Add in this to the sample from tutorial 1 and you get this map.
As you can see the map is centered on Los Angeles.This is really cool but it gets even better. This is where we do the deep dive into what the rest of the variables that you can pass do. Below you will see a example of the function with all the possible variables that you can pass in.
LoadMap(VELatLong, zoom, style, fixed, mode, showSwitch, tileBuffer, mapOptions)
Lets talk about what each one of these variables does
| VELatLong |
- |
A VeLatLong Class object that represents the center of the map..Like LA |
| zoom |
- |
A zoom level to display. Valid values range from 1 through 19. Optional. Default is 4. 1 being the highest(from Space) |
| style |
- |
A VEMapStyle Enumeration value specifying the map style. Optional. Default is VEMapStyle.Road. 'h' -hybid, 'r' - road, 'o' - obilique , 'a' -a ariel |
| Fixed |
- |
A Boolean value that specifies whether the map view is displayed as a fixed map that the user cannot change or move it around. Default is false. |
| mode |
- |
A VEMapMode Enumeration value that specifies whether to load the map in 2D or 3D mode. Optional. Default is VEMapMode.Mode2D or Mode3D. Note 3d requires a plug in |
| showSwitch |
- |
A Boolean value that specifies whether to show the map mode switch on the dashboard control this means change from 2d to 3d. Optional. Default is true (the switch is displayed). |
| TileBuffer |
- |
How much tile buffer to use when loading map. Default is 0 (do not load an extra boundary of tiles). This parameter is ignored in 3D mode. Bigger buffer here gives the user faster reaction when they start to drag the map around |
| mapOptions |
- |
A VEMapOptions Class that specifies other map options to set. |
Now that we have that out of the way we can go ahead and play with all the values.Check out this demo i have set up for you. Of course the all source included. It works best in firefox right now due to a bug in ie. I am working on a fix.
LIVE DEMO | SOURCE