playground-ads-library-test-app-a

// set custom settings //// some settings here are optional as there will be fallbacks if not supplied const settings = { venueListUrl: 'https://assets.playground.xyz/zheng/c37c88c6_dine_store_locator.json', // mandatory container: $('#storeLocator'), // mandatory ipDataApiKey: 'ede8bee45b3877101765285019c64dd7d3fcc23def77dbe0a0a36202', // optional useUserLocation: true, // optional defaultLocation: 'Sydney', // optional annotationLogo: 'https://assets.playground.xyz/zheng/tcxqskncs1c.png', // optional & validatable, if false fallback to default pinGlyphIcon: 'https://assets.playground.xyz/zheng/tcxqskncs1c.png', // optional & validatable, if false fallback to default pinBackgroundColor: 'red', // optional & validatable, if false fallback to default blue }

Usage no npm install needed!

<script type="module">
  import playgroundAdsLibraryTestAppA from 'https://cdn.skypack.dev/playground-ads-library-test-app-a';
</script>

README

Store Locator

Quick Start

1. set custom settings

// set custom settings
//// some settings here are optional as there will be fallbacks if not supplied
const settings = {
    venueListUrl: 'https://assets.playground.xyz/zheng/c37c88c6_dine_store_locator.json', // mandatory
    container: $('#storeLocator'), // mandatory
    ipDataApiKey: 'ede8bee45b3877101765285019c64dd7d3fcc23def77dbe0a0a36202', // optional
    useUserLocation: true, // optional
    defaultLocation: 'Sydney', // optional
    annotationLogo: 'https://assets.playground.xyz/zheng/tcxqskncs1c.png', // optional & validatable, if false fallback to default
    pinGlyphIcon: 'https://assets.playground.xyz/zheng/tcxqskncs1c.png', // optional & validatable, if false fallback to default
    pinBackgroundColor: 'red', // optional & validatable, if false fallback to default blue
}

// initiating the map
storeMapInit(settings)

3. call jQuery, MapKit and the Library with CDN

<script data-src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="https://cdn.apple-mapkit.com/mk/5.x.x/mapkit.js"></script>
<script src="https://cdn.jsdelivr.net/gh/playground-xyz/playground-custom-ads-library@{version/latest}/dist/storeLocator.min.js"></script>

{version} can be the release version on GitHub or simply use @latest to grab the latest release on GitHub

4. Initiating the Application

storeLocator.storeMapInit(settings);