Maybe someone knows how to implement the yandex map on android, so that it works quickly and without lags? I tried to use the yandex mapkit library, but something is not all there, it works smoothly, then I tried it through the API, and output it to WebView, but again there are problems. Somehow this is all wrong, or I have implemented it poorly.

I want to achieve the same result as in this app: https://play.google.com/store/apps/details?id=ru.taximaster.tmtaxicaller.id0960&hl=en

Maybe, who knows how the yandex card is implemented there?

Ps There are suspicions that the application uses the osm card and imposes tiles on it yandex map

  • Well, on the webview and implemented. And what are the problems with webview? - Shutko Alexander
  • @ShutkoAleksandr When using WebView and API 2.0, there is something like an auto-correction type. When you move the card with your finger and then you remove your finger, it does not remain in the same position (the catfish is slightly shifted). Is it possible to remove this effect? If API API 2.1, then here + to the correction, the map is drawn after you remove your finger (you get the effect that you move the pictures). - Deno
  • Never observed such an effect. Where you move there and remain. Apparently the features of your implementation .. - Shutko Alexander
  • @ Shutko Alexander, could you show me a typical example of a map output on android studio? Maybe what I did wrong. Which API version are you using? - Deno
  • Just tomorrow. Now I'm writing from my phone. There is no code at hand. - Shutko Alexander

1 answer 1

Specifically, in the indicated application, the taxi is implemented apparently through some kind of bicycle of its own, or it is a mapkit file processed (in the device monitor output in the webview markup is missing, and the map lies in the normal View). Through my WebView, in my experience, it also works quite well for itself.

In general, here is the implementation of the map output (view initialization):

mapWebView = (WebView) findViewById(R.id.mapWebView); mapWebView.addJavascriptInterface(mapJSInterface, "MyApp"); WebSettings webSettings = mapWebView.getSettings(); webSettings.setJavaScriptEnabled(true); try { InputStream is = getAssets().open("map.html"); byte[] buffer = new byte[is.available()]; if (is.read(buffer) <= 0) Logger.Warn("Can't read embedded assets map.html file!"); is.close(); String htmlText = new String(buffer); mapWebView.loadDataWithBaseURL("http://ru.yandex.api.yandexmapswebviewexample.ymapapp", htmlText, "text/html", "UTF-8", null ); } catch (IOException e) { Logger.Exception(e); } webSettings.setCacheMode(WebSettings.LOAD_DEFAULT);

Here is the actual html file (I’ve picked up custom buttons and handlers):

 <!doctype html> <html> <head> <title>Map</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <script src="http://api-maps.yandex.ru/2.1/?lang=ru_RU" type="text/javascript"></script> <meta name="viewport" content="width=device-width,height=device-height, user-scalable=no"/> <script type="text/javascript"> ymaps.ready(init_map); var myMap; var _ymapZoomPromise = null; function init_map() { var myPlacemark; MyApp.OnPageLoaded(); myMap = new ymaps.Map('map', { center: [48.47655, 135.064308], zoom: 6, controls: [], behaviors: ["default", "scrollZoom"] }, { suppressMapOpenBlock: true, }); myMap.events.add('click', function (e) { var coords = e.get('coords'); // putBaloon(coords); }); } </script> <style> * { -webkit-user-select: none; -webkit-touch-callout: none; -webkit-user-drag: none; -webkit-user-modify: unset; } html, body, #map { width: 100%; height: 100%; margin: 0; padding: 0; } #map { background-color: #ffffff; } </style> </head> <body> <div id="map"></div> </body> </html>

Here is MyApp.OnPageLoaded(); javascript interface to the application. When you call, it hides the download progress bar and displays the hidden WebView. Here in this version I checked on 4.0 / 4.1 / 4.2 / 5/6 versions both on real hardware and on emulators. Quite to itself smoothly works and does not twitch even on weak gland. The only negative is that the view loading takes at least 4 seconds.

There are optimization options - to load not all JS API, but only the necessary modules.

  • What is mapJSInterface? - Deno
  • This is a class for interacting with application code. There is GPS initialization inside and methods like @JavascriptInterface public void OnPageLoaded () {if (locationListener! = Null) locationListener.OnPageLoaded (); } well, and the JS code inside the webview calls them. And the same OnPageLoaded hides the download progress bar and shows the map itself - Shutko Alexander
  • When you sharply remove your finger, the catfish card moves up. This is not how not to get rid of. It creates the effect that the card lags. Stopped at YMK managed to optimize the map. - Deno
  • I have no such effect on any platform. How to play? - Shutko Alexander