Skip to main content

Geocoding - Region biasing

    Today we will have a look at a simple geocoding example wherein we will see the effects of region biasing on geocoding. First things first. What is region biasing in geocoding and why is it required; would be an obvious looking question here. The answer to this is pretty simple and straight. Region biasing means returning a geocoded address so that it falls in the region specified. Consider the example of the city named “Hyderabad” which is  present in India as well as Pakistan. Now, suppose that my target users are from India, then by using the region biasing property, the geocoder will always return the “Hyderabad” in India when a user enters a request for the same. I have taken the same example in the code, so that the region biasing geocoding concept would become much more clear.

    The code goes here…


    The code is pretty simple and does not need an explanation. The crux of the code lies in the following line of code.


    As you can see, the region property is set to “IN” which is a code for India. This is a hardcoded example, where the address to be geocoded is set to “Hyderabad”. Check out the line, var query = "Hyderabad". Now as the region is set to India the output that would be seen will be as seen in the result section above.

    Now change the region value to “PK”, i.e. Pakistan as,


    The output that you will see is as below:



    If you have any queries regarding the code feel free to leave a comment! Till the next Google Maps API v3 example…Keep mapping!
Labels:

Comments

  1. IndiaVote09August 30, 2011 at 1:34 AM

    I tried region=IN but still getting suggestions for outside india.
    I am using auto complete to show suggestion like google maps do

    ReplyDelete
    Replies
    1. Shreerang PatwardhanMarch 10, 2012 at 12:27 AM

      Hi IndiaVote09.

      Could you let me know what were you looking for (geocoding) with region=IN?

      Please respond and I would be happy to check and revert!

      Regards,
      Shreerang.
      Like us on Facebook at https://www.facebook.com/pages/Spatial-Unlimited/185149371538692

      Delete

Post a Comment

Please leave your comments here...

Recommended for You

ES6 101 - Map

Spatial Unlimited changes to The UI Dev After being hosted on blogger 😣 for the last 6 years 📆, this page has finally been moved to Github.io This means a few things for you, dear reader! You will be redirected to the new page shortly! ⏩ ⏩ ⏩ Once crapy HTML is now better looking Markdown ! 😍 😍 The entire blog is a Github repo ! 😍 😍 Spatial Unlimited is now The UI Dev 😍 😍
Post a Comment
Read more

Jquery Mobile Form - Slider control

    Input field of type range is newly introduced in HTML5 and is very well styled. The style is further enhanced when using the Jquery Mobile framework and we will see how this can be done in today's post. Jquery Mobile styles the range input type with capsule-corners and adds a circular handle to the slider.   The input's value is used to configure the starting position of the handle and the value is populated in the text input. Specify the min and max attribute values to set the slider's range. If you want to constrain input to specific increments, add the step attribute.   As you drag the slider's handle, the framework will update the native input's value (and vice-versa) so they are always in sync; this ensures that the value is submitted with the form.     The range input elements are available in 2 flavors/sizes - regular and mini. Adding a data attribute data-mini="true" to the input tag renders a smaller sized input el...
Post a Comment
Read more

Jquery Mobile - Filtering the Listview

    So you have a very long list of items and you want to provide the users with a searching facility. There is nothing to worry here. Jquery Mobile provides a very simple solution to a very difficult and time-comsuming looking problem.   jQuery Mobile provides a very easy way to filter a list with a simple client-side search feature. To make a list filterable, simply add the  data-filter="true"  attribute to the list. The framework will then append a search box above the list and add the behavior to filter out list items that don't contain the current search string as the user types. The input's placeholder text defaults to "Filter items...".     Now again, this is not going to satisfy the client. The client will not like the default search and will ask for  customization . No problem again. We can do it very easily again by virtue of the Jquery Mobile framework.   To configure the placeholder text in the search input,  use the data ...
Post a Comment
Read more

Difference between word-break: break-all versus word-wrap: break-word

    The 2 CSS properties  word-break: break-all  and  word-wrap: break-word  appear to work in the same way or generate the same output, but there is a slight difference between the 2 and we will be discussing these differences today.     Take a look at the example above. The difference is quite evident, however I will try to explain it further. word-break: break-all Irrespective of whether it’s a continuous word or many words, break-all breaks them up at the edge of the width limit even within the characters of the same word word-wrap: break-word This will wrap long words onto the next line. break-word adjusts different words so that they do not break in the middle.     So if you have many fixed-size spans which get content dynamically, you might just prefer using  word-wrap: break-word , as that way only the continuous words are broken in between, and in case it’s a sentence comprising many words, the spa...
Post a Comment
Read more

Jquery Mobile - Theming listview icons

    After exploring all the standard listview types in the series of examples on listview, you must have observed that for a linked list, Jquery Mobile displays a standard "arrow-r" icon to the extreme right of the list. However, you don't want the standard "arrow-r" icon and you need some custom icon there.     Jquery Mobile provides a set of icons that can be used along with listviews in place of the standard "arrow-r" icon. To override the standard icon, set the data-icon attribute on the desired list item to the name of a standard icon. We will see a complete list of icons in the following example.     However, before proceeding to the example, let us also consider a case where we do not wish to have any icon on the list item. This too can be achieved by setting the value of data-icon attribute to false. We will also include this in our example that follows.     Hope you have followed this post. Do drop a line in case you fi...
Post a Comment
Read more