info@enlightsolution.com           01710-318199           9:00AM - 6:00PM

  • Home
  • Services
    • Custom Software Development
    • Web Application
    • Mobile Application
  • Products
    • Enlight Business Solutions
    • Enlight Accounting
    • Enlight HR & Payroll
    • Enlight POS
    • Asset Management System
  • Portfolio
  • Insights
  • About Us
  • Career
  • Contact US

Animate map to a point by pressing here in React Native

Animate map to a point by pressing here in React Native

by Admin / Tuesday, 22 October 2019 / Published in Mobile App Development

How to navigate a map to the region where user will press on map?

This blog is written for view a map and navigate it to a point by pressing here in react native.

To do it we need to change the map region by the value of latitude and longitude of the place where will be pressed on map.

Region is the middle point of map view.

Firstly we can set user location as initial region of the map to open it.

Then we have to set location point of the place where user pressed as the region of map view.

To find the latitude and longitude value of that palace we have to use onPress event of mapview. This event returns the location off that point where user pressed.

onPress is  a Callback that is called when user taps on the map and return  { coordinate: LatLng, position: Point }.

Using this onPress event we will animate map to that region using a function named animateMap().

In animateMap() function we need the reference of map view to animate it. So we make a reference here and the reference is _mapView.

The animateMap() function is given bellow-

After complete these the middle point of mapview will be moved on the place where user will press.

Thank You

About Admin

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

ENLIGHT SOLUTIONS

Enlight Solutions is working with Leading software development system. We provide out clients nice and fluent software solutions in minimum amount of time.

Quick Links

  • About Us
  • Products
  • Services
  • Portfolio
  • Blog
  • Career

All right reserved.
ENLIGHT SOLUTIONS @ 2019

  • Home
  • contact us
TOP