My Location&My Path app(do it android mission 20)

한글 블로그로 보기


GoogleMapwithMypath

This app is display my current moving path on map.

If you run the app the app displays 3 button and 1 input text.

If you touched 'rec' button then app getting your location using GPS or Network every 3 second.

And app save in database that displays your moving path on map using polyline.

If you touched 'stop' button then app delete polyline and database.

This picture is normal state(you run the app)

This picture is touched 'rec'button

This picture is touched 'stop' button

1. Using Database


Adding MainActivity.java code for using database

MainActivity.java

1. mapview.getSettings().setDatabasePath("/data/data/"+this.getPackageName()+"/databases/");
2. mapview.getSettings().setDomStorageEnabled(true);
3. mapview.getSettings().setDatabaseEnabled(true);
4. mapview.getSettings().setAppCacheEnabled(true);

It code need for using database.

and need a javascrpit code

index.html

1. function setdatabase(){
2.     getMylocation();
3.     var sumlatlnt=curLat+","+curLng;
4.     localStorage.setItem(keycnt,sumlatlnt);
5.     keycnt++;
6. }

important is "localStorage.setItem(key,value)"

This code is record to database.

and if you reading value in database

You need a this code

"var temp=localStorage.getItem(key)"

and remove code is
"localStorage.removeItem(key)"


2. overlay using polyline

It's simple drawing polyline using google maps API

you just add this code to initialize

1. var polyOptions = {
2.     strokeColor: '#000000',
3.     strokeOpacity: 1.0,
4.     strokeWeight: 3
5.   };
6.   poly = new google.maps.Polyline(polyOptions);
7.   poly.setMap(map);
8.   path = poly.getPath();

you possible to reference google API about polyOption.

and adding event function "path.push(event.latLng);"

But I used another method.

1. if(navigator.geolocation) {
2.      navigator.geolocation.getCurrentPosition(function(position) {  
3.          curLat=position.coords.latitude;
4.          curLng=position.coords.longitude;
5.          var newpos = new google.maps.LatLng(curLat,curLng);
6.          map.setCenter(newpos);
7.          path.push(newpos);
8.      }, function() {
9.       handleNoGeolocation(true);
10.     });
11.    
12.      
13.   } else {
14.    
15.     handleNoGeolocation(false);
16.   }

because I want my current location using gps

"path.push(latLng)" is draw polyline on map.

And "path.clear()" is clear polyline on map.