[khtml.maplib] Re: my khtml based project, mobile questions

  • From: bernhard zwischenbrugger <bz@xxxxxxxxxxxxxxx>
  • To: khtml.maplib@xxxxxxxxxxxxx
  • Date: Wed, 31 Aug 2011 10:07:32 +0200


There is no debug-console build in in android browser.
For Debugging a special app is needed:
https://market.android.com/details?id=com.js.Error&feature=search_result <https://market.android.com/details?id=com.js.Error&feature=search_result>

If you want you can try to debug but that's not really easy. logcat is producing
lots of output and it's not easy to see the real bugs.
At the moment we don't have a Android phone for testing, but the next semester will
start soon and at the univercity we have lots of Android phones.

There is a possibility for automatic bug reporting:


function onerror(error,file,line){
var url="/iphonemapproxy/bugimage.php?error="+error+"&file="+file+"&line="+line+"&useragent="+navigator.userAgent;

This will send the error message to the server. (but I'm not sure if that works on android)


I could only test it on iPhone and iPad, there it worked perfectly well.
Unfortunately I do not have any Android-devices.

Do the built-in browser or Opera Mini have a debug-console?
Maybe there is an error message that can help us to search for bugs!

rgds, ewald

Am 31.08.2011 um 00:28 schrieb Mátrai Tamás:

Hi Bernhard!

I tested the link you provided on my Android (FirmWare 2.1,update 1) Samsung Galaxy GTI9000 mobile.

In its built in browser it works perfectly. I tested zoom in/zoom out icons, panning by touch,
zoom in in and out by two fingers and they all worked great.

By using Opera Mini (5.1.22460) map was not interactive. The map appeared, but no zoom in, out, pan,
no touch gesture handling.

Pls. let me know if I can help You in testing.

I hope I could help,
Best Regards:

On Aug 31, 2011, at 12:06 AM, bernhard zwischenbrugger wrote:

I tested my simple KHTML web client in my Samsung Galaxy Android phone. I found neither its built-in web browser nor Opera mini could operate my map as I expected. I can see the map, but I can not zoom in, pan, so it seems it is 'just' an image - with my markers on it - but not an interactive map. My questions are: - Aren't mobile browsers supported? As I read there is some support for IPHone, but what about Android? - Are there any mobile phone specific features/trick that can be used to show interactive maps in mobile browsers?
We added lots of features in the last months and testing for all platforms is very time consuming. The maplib was first developed for iPhone and multitouch is supported there. Android also uses webkit, has no multitouch but normal (one finger) touchscreen is supported.

Maybe we added a new bug in the last days - khtml.maplib is still beta software.

Please have a look at:
That's an older version I tested on iPhone and Android. Let me know if this works on Samsung.
(API changed in the newer version)

Ewald also tested on mobile devices, but I don't know if he used iPhone or Android.

Starting end of September my focus will be on Mobile Devices again.

Client/Server communication is not part of this lib but if you need I can show you some client/server examples. At the moment vector graphics is a bit buggy, but that will hopefully change in a few days.


Best Regards:

On Aug 30, 2011, at 7:15 PM, Mátrai Tamás wrote:

Hello Ewald!

Now it is okkey! :)

The misunderstanding was caused by http://mt091110.students.fhstp.ac.at/gsoc/v2/khtml_marker.html It is in OSM WIKI, and in its source code mr.Size and mr.Point was used, so I get it from there.

I'll go on and test on.


On Aug 30, 2011, at 7:04 PM, Ewald Wieser wrote:

Hello again,

there is an API-documentation in the zip-file and some examples for the markers as well.
maybe this can help you.

btw: i just made another change in the lib today deleting two classes (mr.Size and mr.Point). so you might want to replace the definitions for image and shadow with:

// define icon
var image = new mr.overlay.MarkerImage(
 {width: 20, height: 20},
 {x: 0, y: 0},
 {x: 10, y: 20}

// define shadow
var shadow = new mr.overlay.MarkerImage(
 {width: 34, height: 20},
 {x: 0, y: 0},
 {x: 10, y: 20}

if you need further help, it would be good if you could paste the output of the developer-tool console of your browser.

hope this helps.
br ewald

Am 30.08.2011 um 18:17 schrieb Mátrai Tamás:

Hello Eward!

Thx for the fast reply!

I have downloaded your fixed code but unfortunately it does not work.
I can not even add markers to map, so my map is empty.
I use the same function to show markers I sent in my previous mail.
When I switch back to the 'old' library my markers are shown on the map - without making any changes in code.
I triple checked it, so it is 100% sure on my side.

Okkey, when I am completed I'd show you!


On Aug 30, 2011, at 5:49 PM, Ewald Wieser wrote:

Hello Tamas,

with marker.clear() you can remove one marker from the map.
Unfortunately I just found a little bug in the clear-function.
I have uploaded a new version at http://mt091110.students.fhstp.ac.at/khtml/maplib.tar.gz <http://mt091110.students.fhstp.ac.at/khtml/maplib.tar.gz>

If you would like to remove all overlays at once, you can use map.removeOverlays();

Sorry for the inconvenience, but this library is still beta.
But I'm glad that you like it!

Maybe you can show us the result of your work.
brgds Ewald

Am 30.08.2011 um 17:18 schrieb Mátrai Tamás:

Hi All!

I am Tamas Matrai from Hungary, I've just start to play with KHTML maps.

It is looking great, it is very promising, thx for this great project!
I could create my app I need in some hours.
It is a simple one that shows some markers on the map, based data coming from GPS devices.

My problem is with clearing markers from the map, after adding one I can not clear it. It tried several ways but neither works.

I use GSOC improved javascript library from here: http://wiki.openstreetmap.org/wiki/Improving_khtml.maplib#Markers

My code (note this is very experimental one!):
I have a global variable:

var mr = new Object(khtml.maplib);

The following function adds a marker to the map (markerStr some delimited string contains position and extra data):

function RefreshMarkers(markersStr)
    var sentences = markersStr.split("\r\n");
for (i = 0; i < sentences.length; i++) {

var sentenceParts = sentences[i].split("%_@");

var image = new mr.overlay.MarkerImage(
new mr.Size(20, 20),
new mr.Point(0, 0),
new mr.Point(10, 20)

var shadow = new mr.overlay.MarkerImage(
new mr.Size(34, 20),
new mr.Point(0, 0),
new mr.Point(10, 20)

var shape = {
coord: [14, 0, 15, 1, 16, 2, 17, 3, 18, 4, 19, 5, 19, 6, 19, 7, 19, 8, 19, 9, 19, 10, 19, 11, 19, 12, 19, 13, 19, 14, 18, 15, 17, 16, 16, 17, 15, 18, 13, 19, 5, 19, 4, 18, 2, 17, 2, 16, 1, 15, 0, 14, 0, 13, 0, 12, 0, 11, 0, 10, 0, 9, 0, 8, 0, 7, 0, 6, 0, 5, 1, 4, 2, 3, 2, 2, 4, 1, 5, 0, 14, 0],
                    type: 'poly'

var pLatLng = new mr.LatLng(sentenceParts[4], sentenceParts[3]);
var marker2 = new mr.overlay.Marker({
                    position: pLatLng,
                    map: map,
                    title: sentenceParts[1] +
"\r\n" + sentenceParts[2] +
"\r\n" + sentenceParts[0] +
"\r\n" + sentenceParts[5] + " km/h" +
"\r\n" + sentenceParts[9]

So, as I said adding is OK, but later I can not remove them (neither in this RefreshMarkers function for testing purposes). So, how can I do this? Is there any way to clear all markers from a map?


Other related posts: