JavaScript Summary plugin

Drop a table of nearby points of interest — distance and travel time to each — onto any page with one config object.

Live demo

Yes, the default styling is functional rather than beautiful — on purpose. The plugin ships the data; the design is up to you. Bring your own CSS and make it match your site.

Hello world

<div id="summary"></div>

<script>
    yatmoSummaryConfig = {
        licenseKey: 'xxxxxxxxxxxxxxxxxx',
        language: 'EN',
        country: 'BE',          // optional
        container: 'summary',
        latitude: 50.8520525,
        longitude: 4.3442926
    };
</script>
<script src="https://map.yatmo.com/summary.js"></script>

Things to know

First call can be slow

The first request for a new latitude/longitude pair takes ~1 second while Yatmo precomputes distances to the nearest POIs. All subsequent calls hit the cache and return immediately.

Your CSS may bleed into the summary table — expect to write a small override if the default rendering clashes with your theme. The plugin is responsive but you may need to tweak it for your layout.

If you want a completely different look (your own icons, a non-table layout), call the Summary API directly and render it yourself.

The name yatmoSummaryConfig is fixed — the plugin looks for it by name.

Required parameters

Name	In	Type	Description
licenseKey required	config	string	Your Yatmo frontend key — the one safe to embed in HTML. See License & keys.
language required	config	string	Language ISO code for tooltips and labels.
container required	config	string	Id of the DIV where the summary should render.
latitude required	config	number	Latitude of the property.
longitude required	config	number	Longitude of the property.

Optional parameters

Name	In	Type	Description
country	config	string	Country ISO code; used for region-specific filtering.