Basic examples

Standart map

HTML:

   
<div class="" id='property-map-plugin-1'></div>
                

JS:

                        
var map_near = $('#property-map-plugin-1');
    map_near.near_places();
    map_near.near_places('setMarker', {ltng :[45.812231, 15.920618]});
                

Standart map with custom style

HTML:

   
<div class="" id='property-map-plugin-2'></div>
                

JS:

                        
var map_near = $('#property-map-plugin-2');
    map_near.near_places({
        'mapOptions': {
                styles: [{"featureType":"landscape","stylers":[{"hue":"#FFBB00"},{"saturation":43.400000000000006},{"lightness":37.599999999999994},{"gamma":1}]},{"featureType":"road.highway","stylers":[{"hue":"#FFC200"},{"saturation":-61.8},{"lightness":45.599999999999994},{"gamma":1}]},{"featureType":"road.arterial","stylers":[{"hue":"#FF0300"},{"saturation":-100},{"lightness":51.19999999999999},{"gamma":1}]},{"featureType":"road.local","stylers":[{"hue":"#FF0300"},{"saturation":-100},{"lightness":52},{"gamma":1}]},{"featureType":"water","stylers":[{"hue":"#0078FF"},{"saturation":-13.200000000000003},{"lightness":2.4000000000000057},{"gamma":1}]},{"featureType":"poi","stylers":[{"hue":"#00FF6A"},{"saturation":-1.0989010989011234},{"lightness":11.200000000000017},{"gamma":1}]}],
            }
    });
    map_near.near_places('setMarker', {ltng :[45.812231, 15.920618], 'address':'Ilica 345, HR-10000'});
                

Standard map with custom zoom

HTML:

   
<div class="" id='property-map-plugin-3'></div>
                

JS:

                        
var map_near = $('#property-map-plugin-3');
    map_near.near_places({
        'mapOptions': {
                'zoom' : 10,
            }
    });
    map_near.near_places('setMarker', {ltng :[45.812231, 15.920618], 'address':'Ilica 345, HR-10000'}););
                

Standard map with custom radius

HTML:

   
<div class="" id='property-map-plugin-4'></div>
                

JS:

                        
var map_near = $('#property-map-plugin-4');
    map_near.near_places({
        'mapOptions': {
                'zoom' : 10,
                'radius' : 50000,
            }
    });
    map_near.near_places('setMarker', {ltng :[45.812231, 15.920618], 'address':'Ilica 345, HR-10000'});
                

Standard map with example translate text to Croatian

HTML:

   
<div class="" id='property-map-plugin-5'></div>
                

JS:

                        
var map_near = $('#property-map-plugin-5');
map_near.near_places({
    'translatable': {
            'Health' : 'Zdravlje',
            'PetrolPump' : 'Benzinska crpka',
            'Restaurant' : 'Restoran',
            'ATMBank' : 'Bankomata',
            'Store' : 'Dućan',
            'Distance' : 'Udaljenost',
            'Address' : 'Adresa',
            'WalkingTime' : 'Vrijeme hodanja',
            'Details' : 'Detalji',
        }
});
map_near.near_places('setMarker', {ltng :[45.812231, 15.920618], 'address':'Ilica 345, HR-10000'});
                

Change marker

HTML:

   
<div class="" id='property-map-plugin-6'></div>
                

JS:

                        
var map_near = $('#property-map-plugin-6');
    map_near.near_places();
    map_near.near_places('setMarker', {ltng :[45.812231, 15.920618], 'address':'Ilica 345, HR-10000'});

    $('#plugin-6-change-marker').on('click',function(){
        map_near.near_places('setMarker', {ltng :[45.812204, 15.898712], 'address':'HR-10000'});
    })