Map issue HTML5 & CSS3

Discussion in 'Web Design and Development' started by JamesD95, Apr 12, 2014.

  1. JamesD95 macrumors newbie


    Apr 12, 2014

    I am trying to create a interactive map. From a certain place e.g a business and for a circle for the radius, which has been set. From this the user can enter their postcode and find whether an item can be delivered to their address and display on the map that they are outside the area the item is delivered.

    Any help will be much appreicated:D
  2. Moshu macrumors member

    May 3, 2012
    I would take the following steps:

    1. define the business GPS coordinates (check Google Maps)
    2. find a way to translate the customer's postal code or address into GPS coordinates
    3. calculate the distance between the two GPS coordinates and compare it with your pre-defined radius. Inform the customer it's outside the area if needed.
    4. if you want to also display this in a graphical manner, you can try Google Maps again or create your custom solution

    In this moment, for me it looks like point 2 is the biggest unknown and maybe hardest to implement as I never did this.

    The others are pretty easy.

    Good luck!
  3. Haynzee macrumors member

    Mar 13, 2012
  4. morespce54 macrumors 65816


    Apr 30, 2004
    Around the World
    As mentioned above, it's all about geo-coding and reverse geo-coding. Both can be done, at least with Google Map API.

    The basic idea is that you take a civic address (or postcode), use the API to translate it to longitude and latitude, take your business longitude and latitude, use the matrix to calculate the distance between your business and the user's address (or postalcode), check if it's within your range and then, if need be, translate the location (longitude and latitude) of the nearest location back to regular civic address and return it to the user.

    Long story short, your calculations must be done in longitude and latitude. So you must translate all your civic addresses (your own and the one entered by the user) since that's the easiest (only?) way to calculate the distance between to point.

Share This Page