Basic integration

To use the new version of the geowidget, add the following lines to the page headers.

<link rel="stylesheet" href="https://geowidget.inpost.pl/inpost-geowidget.css"/>
<script src='https://geowidget.inpost.pl/inpost-geowidget.js' defer></script>
<script> 
  function afterPointSelected(point) { alert('Selected point: ' + point.name); } 
</script>

And then embed the custom element in the selected place

<inpost-geowidget token='token-for-geo' language='pl' config='parcelcollect'></inpost-geowidget>

The parameters are described here

Complete integration

To use the new version of the geowidget, add the following lines to the page headers.

<link rel="stylesheet" href="https://geowidget.inpost.pl/inpost-geowidget.css"/>
<script src='https://geowidget.inpost.pl/inpost-geowidget.js' defer></script>
<script>
  document.addEventListener('onpointselect', (event) => alert(event.details.name));
</script>

And then embed the custom element in the selected place

<inpost-geowidget onpoint="onpointselect" token='token-for-geo' language='pl' config='parcelcollect'></inpost-geowidget>

The parameters are described here

property	description
onpoint	The parameter takes the function / name to be performed after selecting a point on the map
token	Parameter to which you should pass the PUBLIC token generated in the package manager application ( https://manager.paczkomaty.pl/ - MY ACCOUNT>API> GEOWIDGET).
language	A parameter that allows to define the default language of the widget - optional. If the user has already used the new version of the geo widget - the interface will be displayed in the language he used previously. (pl, en and uk)
config	A parameter that defines which functions / types are to have the points displayed on the map (values are described in the table below).

Description of config options

#	Opis	config value	Points type	Statuses	functions	payment_available	location_247	Partner id	Filters for type
1	Showing pickup points for pre-paid orders	config='parcelCollect'	parcel_locker	Operating,NonOperating,Overloaded	parcel_collect	false	false	x	All: parcel_locker Parcel lockers: parcel_locker_only Parcel point: parcel_locker_superpop
2	Presentation of collection points for pick-up orders	config='parcelCollectPayment'	parcel_locker	Operating,NonOperating,Overloaded	parcel_collect	true	X	x	All: parcel_locker Parcel lockers: parcel_locker_only Parcel point: parcel_locker_superpop
3	Presentation of collection points for PWW orders	config='parcelCollect247'	parcel_locker	Operating,NonOperating,Overloaded	parcel_collect	X	true	x	All: parcel_locker Parcel lockers: parcel_locker_only Parcel point: parcel_locker_superpop
4	Presentation of senders points	config='parcelSend'	parcel_locker,pop	Operating,Overloaded	parcel_send	X	X	x	All: parcel_locker, pop Parcel lockers: parcel_locker_only Parcel point: pop,parcel_locker_superpop
5	Presentation of InPost pickup points for pre-paid orders	config='parcelCollectInPost'	parcel_locker	Operating,NonOperating,Overloaded	parcel_collect	X	X	0,33,61	All: parcel_locker Parcel lockers: parcel_locker_only Parcel point: pop,parcel_locker_superpop
6	Presentation of InPost collection points for cash on delivery orders	config='parcelCollectPaymentInPost'	parcel_locker	Operating,NonOperating,Overloaded	parcel_collect	X	X	0,33,61	All: parcel_locker Parcel lockers: parcel_locker_only Parcel point: pop,parcel_locker_superpop

API documentation

Example how to call api method:

<inpost-geowidget id="geowidget" onpoint="handlePointSelection" token='myTokenHere' language='pl' config='parcelCollect'></inpost-geowidget>

<script>
  const geowidget = document.getElementById('geowidget');
  // Listener to Geowidget init event
  geowidget.addEventListener('inpost.geowidget.init', (event) => {
    // Reference to api object
    const api = event.detail.api;

    // Call api method. Check ApiInterface for more details.
    api.changePosition({ longitude: 20.318968, latitude: 49.731131 }, 16);
  });
</script>

All API method are described here