Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Chickapea</title>
<meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
<link href='https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700' rel='stylesheet'>
<script src='https://api.tiles.mapbox.com/mapbox-gl-js/v0.21.0/mapbox-gl.js'></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<link href='https://api.tiles.mapbox.com/mapbox-gl-js/v0.21.0/mapbox-gl.css' rel='stylesheet' />
<script src='https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-geocoder/v1.3.0/mapbox-gl-geocoder.js'></script>
<link rel='stylesheet' href='https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-geocoder/v1.3.0/mapbox-gl-geocoder.css' type='text/css' />
<link href="https://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="mapbox.css">
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<style type="text/css">
body {
color:#404040;
font:400 15px/22px 'Source Sans Pro', 'Helvetica Neue', Sans-serif;
margin:0;
padding:0;
-webkit-font-smoothing:antialiased;
}
* {
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
}
.sidebar {
position:absolute;
width:33.3333%;
height:100%;
top:0;
left:0;
overflow:hidden;
border-right:1px solid rgba(0,0,0,0.25);
}
.pad2 {
padding:20px;
}
.map {
position:absolute;
left:33.3333%;
width:66.6666%;
top:0;
bottom:0;
}
h1 {
font-size:22px;
margin:0;
font-weight:400;
}
a {
color:#404040;
text-decoration:none;
}
a:hover {
color:#101010;
}
.heading {
background:#fff;
border-bottom:1px solid #eee;
min-height:60px;
line-height:60px;
padding:0 10px;
}
.listings {
height:100%;
overflow:auto;
padding-bottom:60px;
}
.listings .item {
display:block;
border-bottom:1px solid #eee;
padding:10px;
text-decoration:none;
}
.listings .item:last-child {
border-bottom:none;
}
.listings .item .title {
display:block;
color:#4f5153;
font-weight:700;
}
.listings .item .title small {
font-weight:400;
}
.listings .item.active .title,
.listings .item .title:hover {
color:#ffcf01;
}
.listings .item.active {
background-color:#f8f8f8;
}
::-webkit-scrollbar {
width:3px;
height:3px;
border-left:0;
background:rgba(0,0,0,0.1);
}
::-webkit-scrollbar-track {
background:none;
}
::-webkit-scrollbar-thumb {
background:#476320;
border-radius:0;
}
.marker {
border: none;
cursor: pointer;
height: 30px;
width: 30px;
background-image: url(ChickpeaMarker.png);
background-color: rgba(0, 0, 0, 0);
transform: translate(28px, 56px, 0);
}
.clearfix {
display:block;
}
.clearfix:after {
content:'.';
display:block;
height:0;
clear:both;
visibility:hidden;
}
.mapboxgl-popup {
padding-bottom: 50px;
}
.mapboxgl-popup-close-button {
display:none;
}
.mapboxgl-popup-content {
font:400 15px/22px 'Source Sans Pro', 'Helvetica Neue', Sans-serif;
padding:0;
width:200px;
}
.mapboxgl-popup-content-wrapper {
padding:1%;
}
.mapboxgl-popup-content h3 {
background:#ffcf01;
color:#4f5153;
margin:0;
display:block;
padding:10px;
border-radius:3px 3px 0 0;
font-weight:700;
margin-top:-15px;
font-family: 'Montserrat', sans-serif;
}
.mapboxgl-popup-content h4 {
font-family: 'Montserrat', sans-serif;
margin:0;
display:block;
padding: 10px 10px 10px 10px;
font-weight:400;
margin: 0;
}
.mapboxgl-popup-content div {
padding:10px;
}
.mapboxgl-container .leaflet-marker-icon {
cursor:pointer;
}
.mapboxgl-popup-anchor-top > .mapboxgl-popup-content {
margin-top: 15px;
}
.mapboxgl-popup-anchor-top > .mapboxgl-popup-tip {
border-bottom-color: #91c949;
}
#geoCon {
position: absolute;
top: 0;
width: 100%;
margin-top: 10px;
}
#geoCon > div {
min-width:50%;
margin-left:30%;
}
</style>
</head>
<body>
<div class='sidebar'>
<div class='heading'>
<h1>Our locations</h1>
</div>
<div id='listings' class='listings'></div>
</div>
<div id='map' class='map'><div id='geoCon'></div></div>
<script>
$( document ).ready(function() {
if (!('remove' in Element.prototype)) {
Element.prototype.remove = function() {
if (this.parentNode) {
this.parentNode.removeChild(this);
}
};
}
mapboxgl.accessToken = 'pk.eyJ1Ijoib3JzbzA4MTk4MCIsImEiOiJQUllaN0l3In0.IfP9ShmcnD9eo_5Q1cqt3A';
var map = new mapboxgl.Map({
container: 'map',
style: 'mapbox://styles/orso081980/cisga97yd000q2xpu6wwjmc1o',
center: [-80.233162, 44.492063],
zoom: 2
});
var geocoder = new mapboxgl.Geocoder({
container: 'geoCon'
});
map.addControl(geocoder);
map.addControl(new mapboxgl.Navigation());
var stores =
{
"features": [
{
"type": "Feature",
"properties": {
"title": "Victoria Street Market",
"address": "1575 Victoria St N",
"city": "Kitchener",
"province": "ON ",
"postalcode": "N2B 3E6",
"phone": "",
"website": ""
},
"geometry": {
"coordinates": [
-80.436209,
43.472895
],
"type": "Point"
},
"id": "009e8b91283146f84715b6ad0dd57215"
},
{
"type": "Feature",
"properties": {
"title": "Alimentation Lebel Inc. (Metro #0778)",
"address": "615 1e Rue",
"city": "La Pocatiere",
"province": "QC",
"postalcode": "G0R 1Z0",
"phone": "(418) 856-3827",
"website": ""
},
"geometry": {
"coordinates": [
-70.037269,
47.3636
],
"type": "Point"
},
"id": "02149b9bbf23667b3d2a1147b54d84c1"
},
{
"type": "Feature",
"properties": {
"title": "McMaster's in Muskoka Fine Foods",
"address": "1512 Hwy 118W",
"city": "Bracebridge",
"province": "ON ",
"postalcode": "P1L 1W8",
"phone": "(705) 646-1541",
"website": ""
},
"geometry": {
"coordinates": [
-79.367281,
45.003329
],
"type": "Point"
},
"id": "029cebd020dc8682d77101ffee05792e"
},
{
"type": "Feature",
"properties": {
"title": "Amber's",
"address": "10 Armstrong St",
"city": "New Liskeard",
"province": "ON ",
"postalcode": "P0J 1P0",
"phone": "(705) 647-7687",
"website": ""
},
"geometry": {
"coordinates": [
-79.671671,
47.508809
],
"type": "Point"
},
"id": "0397701d62cbfce9e6309042603885a5"
},
{
"type": "Feature",
"properties": {
"title": "Harvest Wagon - Yonge",
"address": "1103 Yonge St",
"city": "Toronto",
"province": "ON ",
"postalcode": "M4W 2L7",
"phone": "(416) 923-7542",
"website": ""
},
"geometry": {
"coordinates": [
-79.390717,
43.680203
],
"type": "Point"
},
"id": "05b4338ea983b67efc2438823d154a5c"
},
{
"type": "Feature",
"properties": {
"title": "Nortown Foods - York Mills",
"address": "303 York Mills Road",
"city": "Willowdale",
"province": "ON ",
"postalcode": "M2L 1L3",
"phone": "(416) 447-0310",
"website": ""
},
"geometry": {
"coordinates": [
-79.3872,
43.747827
],
"type": "Point"
},
"id": "0616dd0fcba89e89ea04cd5b80d0f17d"
},
{
"type": "Feature",
"properties": {
"title": "Ambrosia Natural Foods",
"address": "57 Northview Blvd.",
"city": "Vaughan",
"province": "ON",
"postalcode": "L4L 8X9",
"phone": "(905) 264-2510",
"website": "http://ambrosia.ca/"
},
"geometry": {
"coordinates": [
-79.543933,
43.791035
],
"type": "Point"
},
"id": "068be3944b66f5d88c423bf0bbe2fbc0"
},
{
"type": "Feature",
"properties": {
"title": "Abundance Allergy & Gluten Free Shop",
"address": "172 Hunt Street",
"city": "Ajax",
"province": "ON",
"postalcode": "L1S 1P5",
"phone": "(289) 460-2973",
"website": "http://abundancegf.ca/"
},
"geometry": {
"coordinates": [
-79.026214,
43.846328
],
"type": "Point"
},
"id": "0982ef83300fe81b7d77579032b7034a"
},
{
"type": "Feature",
"properties": {
"title": "Pusateri Fruit",
"address": "497 Church St",
"city": "Toronto",
"province": "ON ",
"postalcode": "M4Y 2C6",
"phone": "(416) 923-2043",
"website": ""
},
"geometry": {
"coordinates": [
-79.380599,
43.665241
],
"type": "Point"
},
"id": "0de53fdededf796aa633e172a3070091"
},
{
"type": "Feature",
"properties": {
"title": "Go Organique",
"address": "3260 Rue Jean-Yves",
"city": "",
"province": "Kirkland",
"postalcode": "QC",
"phone": "H9J 2R6",
"website": "(514) 697-9900"
},
"geometry": {
"coordinates": [
-73.88642,
45.441603
],
"type": "Point"
},
"id": "0f2c9185fcf2c7d9b3fb1d49592e7171"
},
{
"type": "Feature",
"properties": {
"title": "Marché du Faubourg Greenfield Park (IGA #8283)",
"address": "300 Avenue Auguste",
"city": "Greenfield Park",
"province": "QC",
"postalcode": "J4V 3R4",
"phone": "(450) 656-7055",
"website": ""
},
"geometry": {
"coordinates": [
-73.464901,
45.486075
],
"type": "Point"
},
"id": "0fe7bb9773968f0bdb63d43d2977f095"
},
{
"type": "Feature",
"properties": {
"title": "Ambrosia Natural Foods",
"address": "55 Doncaster Avenue",
"city": "Thornhill",
"province": "ON",
"postalcode": "L3T 1L7",
"phone": "(905) 881-7811",
"website": "http://ambrosia.ca/"
},
"geometry": {
"coordinates": [
-79.416883,
43.803272
],
"type": "Point"
},
"id": "110a6f98caf477af1212b03b67686ede"
},
{
"type": "Feature",
"properties": {
"title": "Sweet and Sprouted Foods",
"address": "813 - 46th Street East",
"city": "Saskatoon",
"province": "SK",
"postalcode": "S7K 0X1",
"phone": "(306)-717-9923",
"website": "http://www.sweetandsprouted.com/"
},
"geometry": {
"coordinates": [
-106.6541,
52.164373
],
"type": "Point"
},
"id": "14376ca5e8fafef4b6d54a31e9067ecc"
},
{
"type": "Feature",
"properties": {
"title": "The Low Carb Grocery (Burnaby)",
"address": "8610 Glenlyon Parkway",
"city": " Unit 137",
"province": "Burnaby",
"postalcode": "BC",
"phone": "V5J 0B6",
"website": "(604) 568-5673"
},
"geometry": {
"coordinates": [
-123.00786,
49.206339
],
"type": "Point"
},
"id": "162286214b8ab8ffa93fa960ad213dda"
},
{
"type": "Feature",
"properties": {
"title": "Buckingham Meats",
"address": "200 Carnwith Rd E",
"city": "Brooklin",
"province": "ON ",
"postalcode": "L1M 0A1",
"phone": "(905) 620-0300",
"website": ""
},
"geometry": {
"coordinates": [
-78.945033,
43.939779
],
"type": "Point"
},
"id": "1e2b0ffeeddfd201a93fa436ce94f74c"
},
{
"type": "Feature",
"properties": {
"title": "Sue's Fresh Market ",
"address": "205 Don Head Village Blvd",
"city": "Richmond Hill",
"province": "ON ",
"postalcode": "L4C 7R4",
"phone": "(905) 737-0520",
"website": ""
},
"geometry": {
"coordinates": [
-79.460106,
43.866049
],
"type": "Point"
},
"id": "1f2f2a4121e073041ffebde933092b08"
},
{
"type": "Feature",
"properties": {
"title": "Farmers Market",
"address": "83 Bowes St",
"city": " P.O. Box 400",
"province": "Parry Sound",
"postalcode": "ON ",
"phone": "P2A 2X4",
"website": "(705) 746-2424"
},
"geometry": {
"coordinates": [
-80.018732,
45.342657
],
"type": "Point"
},
"id": "21aa5412c58cfd28abced3f15a52e682"
},
{
"type": "Feature",
"properties": {
"title": "McKeen's Metro Glebe #11498",
"address": "754 Bank St",
"city": "Ottawa",
"province": "ON ",
"postalcode": "K1S 3V6",
"phone": "(613) 232-9466",
"website": ""
},
"geometry": {
"coordinates": [
-75.691091,
45.403367
],
"type": "Point"
},
"id": "266222f54981f9a637cd7a42eee3bc8a"
},
{
"type": "Feature",
"properties": {
"title": "Sol Natural Foods",
"address": "186 avenue de la colline",
"city": "Gatineau",
"province": "QC",
"postalcode": "J9J 1S6",
"phone": "(819) 684-0512",
"website": "http://www.solbio.ca/about.php"
},
"geometry": {
"coordinates": [
-75.832403,
45.396398
],
"type": "Point"
},
"id": "27cd66053ecaea6657d6253a4923903f"
},
{
"type": "Feature",
"properties": {
"title": "Foodland #6429 - Eganville",
"address": "8754 Ontario 60",
"city": "Eganville",
"province": "ON ",
"postalcode": "K0J 1T0",
"phone": "",
"website": ""
},
"geometry": {
"coordinates": [
-77.113187,
45.554724
],
"type": "Point"
},
"id": "28f98276fcfb2f8d12c65291e34c5db1"
},
{
"type": "Feature",
"properties": {
"title": "Joanne's Place",
"address": "904 Water Street",
"city": "",
"province": "Peterborough North ",
"postalcode": "ON",
"phone": "K9H 3P3",
"website": "(705) 747-6456"
},
"geometry": {
"coordinates": [
-78.315478,
44.322502
],
"type": "Point"
},
"id": "2f1624a5a4d93551ede2ec37b072a3f9"
},
{
"type": "Feature",
"properties": {
"title": "Evergreen Natural Foods - St. Clair",
"address": "513 St. Clair Ave W",
"city": "Toronto",
"province": "ON ",
"postalcode": "M6C 1A1",
"phone": "(416) 536-4452",
"website": ""
},
"geometry": {
"coordinates": [
-79.418799,
43.682911
],
"type": "Point"
},
"id": "2fd450e24b828ac62c721509a91c685a"
},
{
"type": "Feature",
"properties": {
"title": "Metro #2359 - Alimentation Francois Germain ",
"address": "3575 Ave du Parc",
"city": "Montreal",
"province": "QC",
"postalcode": "H2X 3P9",
"phone": "(514) 843-3530",
"website": ""
},
"geometry": {
"coordinates": [
-74.303377,
45.753417
],
"type": "Point"
},
"id": "3bfc1f2865aa28dfd785b3bfb82e872b"
},
{
"type": "Feature",
"properties": {
"title": "Roulston's Pharmacy",
"address": "65 Donly Drive North",
"city": "Simcoe",
"province": "ON",
"postalcode": "N3Y 5K3",
"phone": "519-426-8011",
"website": "https://www.roulstons.com/"
},
"geometry": {
"coordinates": [
-80.291052,
42.848474
],
"type": "Point"
},
"id": "48ecc6c2ef65c76744d2c0c07ad095b5"
},
{
"type": "Feature",
"properties": {
"title": "Veux-Tu une Biere?",
"address": "372 rue Liege Est",
"city": "Montreal",
"province": "QC",
"postalcode": "H2P 1J6",
"phone": "(514) 871-2771",
"website": ""
},
"geometry": {
"coordinates": [
-71.311164,
46.75591
],
"type": "Point"
},
"id": "4c284757ec9c5476b7f79fce49b0782b"
},
{
"type": "Feature",
"properties": {
"title": "Corn Crib Natural (Moncton)",
"address": "337 Mountain Road",
"city": "Moncton",
"province": "NB",
"postalcode": "E1C 2M5",
"phone": "(506) 854-2941",
"website": "http://corncrib.ca/"
},
"geometry": {
"coordinates": [
-64.791257,
46.096224
],
"type": "Point"
},
"id": "4f3768286621a608636053ec1c5701a1"
},
{
"type": "Feature",
"properties": {
"title": "Kelly's Nutrition",
"address": "820 Red River Road",
"city": "Thunder Bay",
"province": "ON",
"postalcode": "P7B 1K2",
"phone": "(807) 345-1333",
"website": "https://kellysnutrition.foodpages.ca/"
},
"geometry": {
"coordinates": [
-89.247009,
48.445415
],
"type": "Point"
},
"id": "506db189b4a21ce50f79e8a31a18c41e"
},
{
"type": "Feature",
"properties": {
"title": "Mission Sante Thuy Inc",
"address": "1138 Ave Bernard Ouest",
"city": "Outremont",
"province": "QC",
"postalcode": "H2V 1V3",
"phone": "(514) 272-9386",
"website": ""
},
"geometry": {
"coordinates": [
-73.607273,
45.521193
],
"type": "Point"
},
"id": "5165491bcda64bef90b2b9843ad4251e"
},
{
"type": "Feature",
"properties": {
"title": "Cousin's Market",
"address": "1215 Hurontario Street",
"city": "Mississauga",
"province": "ON",
"postalcode": "L5G 3H2",
"phone": "(905) 278-7575",
"website": "www.cousinsmarket.com"
},
"geometry": {
"coordinates": [
-79.587127,
43.559782
],
"type": "Point"
},
"id": "575a0fc33a0cc3ef6987926b1a36006f"
},
{
"type": "Feature",
"properties": {
"title": "The Low Carb Grocery (Markham)",
"address": "170 Esna Park Drive",
"city": " Unit 8",
"province": "Markham",
"postalcode": "ON",
"phone": "L3R 1E3",
"website": "(905) 752-1284"
},
"geometry": {
"coordinates": [
-79.336786,
43.825568
],
"type": "Point"
},
"id": "579f58fc11bde4372718767e4b16cdf1"
},
{
"type": "Feature",
"properties": {
"title": "Louise Sans Gluten Free",
"address": "475 ave Dumont",
"city": "Dorval",
"province": "QC",
"postalcode": "H9S 5W2",
"phone": "(514) 631-3434",
"website": ""
},
"geometry": {
"coordinates": [
-73.751014,
45.447335
],
"type": "Point"
},
"id": "59f9ff44f9657e75616327e573106444"
},
{
"type": "Feature",
"properties": {
"title": "Dynamic Health Service",
"address": "#12-4736 Ladelse Avenue",
"city": "Terrace",
"province": "BC",
"postalcode": "V8G 1R6",
"phone": "(250) 635-5980",
"website": ""
},
"geometry": {
"coordinates": [
-128.595459,
54.517468
],
"type": "Point"
},
"id": "60e131a715116e474b936af0efc45878"
},
{
"type": "Feature",
"properties": {
"title": "Cabbagetown Organics",
"address": "499 Parliament St",
"city": "Toronto",
"province": "ON ",
"postalcode": "M4X 1P3",
"phone": "(416) 913-7296",
"website": ""
},
"geometry": {
"coordinates": [
-79.368026,
43.66473
],
"type": "Point"
},
"id": "63b2537057b7d7049984b9a218925300"
},
{
"type": "Feature",
"properties": {
"title": "Essence of Life",
"address": "50 Kensington Ave",
"city": "Toronto",
"province": "ON ",
"postalcode": "M5T 2K1",
"phone": "(416) 204-1030",
"website": ""
},
"geometry": {
"coordinates": [
-79.400631,
43.654033
],
"type": "Point"
},
"id": "686b51129a7f8243e9d73f80de9e0267"
},
{
"type": "Feature",
"properties": {
"title": "TNS Health Foods (Whitby)",
"address": "1618 Dundas Street East #2",
"city": "Whitby",
"province": "ON",
"postalcode": "L1N 2K8",
"phone": "(905) 240-6066",
"website": "https://www.facebook.com/TNSHealthFoodWhitby/"
},
"geometry": {
"coordinates": [
-78.911187,
43.887593
],
"type": "Point"
},
"id": "73a5c83859f4fd47081353092512134e"
},
{
"type": "Feature",
"properties": {
"title": "The Low Carb Grocery (NewMarket)",
"address": "17215 Leslie Street",
"city": "Newmarket",
"province": "ON",
"postalcode": "L3Y 8E4",
"phone": "(905)235-5688",
"website": "http://www.thelowcarbgrocery.com/"
},
"geometry": {
"coordinates": [
-79.427995,
44.059415
],
"type": "Point"
},
"id": "76e2165e93958150aac4585ea078e51c"
},
{
"type": "Feature",
"properties": {
"title": "Gaudaur Natural Foods",
"address": "17 Andrew St N",
"city": "Orillia",
"province": "ON ",
"postalcode": "L3V 5H9",
"phone": "(705) 325-7143",
"website": ""
},
"geometry": {
"coordinates": [
-79.421277,
44.607922
],
"type": "Point"
},
"id": "76f59550d3e7480bd3ccd2cb8546fa48"
},
{
"type": "Feature",
"properties": {
"title": "Sigrid's Natural Foods",
"address": "506 Days Rd. LaSalle Park Plaza Unit 1",
"city": "Kingston",
"province": "ON ",
"postalcode": "K7M 4X2",
"phone": "(613) 384-1756",
"website": ""
},
"geometry": {
"coordinates": [
-76.572504,
44.236551
],
"type": "Point"
},
"id": "77c916bc847db14614339877134a3da8"
},
{
"type": "Feature",
"properties": {
"title": "Sol",
"address": "186 Ave de la Coline",
"city": "Gatineau",
"province": "QC",
"postalcode": "J9J 1S6",
"phone": "(819) 684-0512",
"website": ""
},
"geometry": {
"coordinates": [
-70.567483,
45.396398
],
"type": "Point"
},
"id": "7b622c0b13f20121c2c07fa78940bcda"
},
{
"type": "Feature",
"properties": {
"title": "Vincenzo's Fine Food",
"address": "150 Caroline St",
"city": "Waterloo",
"province": "ON ",
"postalcode": "N2J 1R1",
"phone": "(519) 741-1437",
"website": ""
},
"geometry": {
"coordinates": [
-80.52151,
43.459453
],
"type": "Point"
},
"id": "810f564894307b0d9cf8cebae1667ee1"
},
{
"type": "Feature",
"properties": {
"title": "Marche S. Bourassa Tremblant Market",
"address": "1109 rue St-Jovite",
"city": "Mont-Tremblant",
"province": "QC",
"postalcode": "J9E 3J9",
"phone": "(819) 425-9009",
"website": "www.bourassatremblant.com"
},
"geometry": {
"coordinates": [
-74.599245,
46.118294
],
"type": "Point"
},
"id": "91798a89a389e2e45cc8bba8bca5d55c"
},
{
"type": "Feature",
"properties": {
"title": "Nutter's Bulk Foods #5",
"address": "605 Main Street North",
"city": "Moose Jaw",
"province": "SK",
"postalcode": "S6H 0W6",
"phone": "(306) 694-0111",
"website": "http://nutters.com/store/en/"
},
"geometry": {
"coordinates": [
-105.536612,
50.395552
],
"type": "Point"
},
"id": "a505d7d4b8e837bb9ffc5814d8dd8d4a"
},
{
"type": "Feature",
"properties": {
"title": "Edible Island Whole Foods Market",
"address": "477 - 6th Street",
"city": "Courtenay",
"province": "BC",
"postalcode": "V9N 1M4",
"phone": "(250) 334-3116",
"website": "http://www.edibleisland.ca/"
},
"geometry": {
"coordinates": [
-125.00052,
49.689489
],
"type": "Point"
},
"id": "a83a92197a677994e4241e9b1cb7a1ae"
},
{
"type": "Feature",
"properties": {
"title": "Limestone Weight Loss Clinic",
"address": "238A Brock Street",
"city": "Kingston",
"province": "ON",
"postalcode": "K7L 1S4",
"phone": "(613) 544-6666",
"website": "http://www.limestoneweightloss.com/"
},
"geometry": {
"coordinates": [
-76.488213,
44.231304
],
"type": "Point"
},
"id": "b451e935400d4e0ee9e0698cc840ef81"
},
{
"type": "Feature",
"properties": {
"title": "Le CRAC aliments sains",
"address": "690 boul St-Jean",
"city": "Quebec",
"province": "QC",
"postalcode": "G1R 1P8",
"phone": "(418) 647-6881",
"website": ""
},
"geometry": {
"coordinates": [
-71.21905,
46.810658
],
"type": "Point"
},
"id": "b5f3a0af60a234b9b957d0b7168ea666"
},
{
"type": "Feature",
"properties": {
"title": "Nutter's Bulk Foods #50",
"address": "102-400 Main Street N.E.",
"city": "Airdrie",
"province": "AB",
"postalcode": "T4B 2N1",
"phone": "(403) 948-6354",
"website": "http://nutters.com/store/en/"
},
"geometry": {
"coordinates": [
-114.012595,
51.294634
],
"type": "Point"
},
"id": "bb741d93224321e79c2d6ef9488f20fd"
},
{
"type": "Feature",
"properties": {
"title": "Courage Foods Ltd.",
"address": "946 Kingston Road",
"city": "Toronto",
"province": "ON ",
"postalcode": "M4E 1S7",
"phone": "(416) 693-2233",
"website": ""
},
"geometry": {
"coordinates": [
-79.287915,
43.680572
],
"type": "Point"
},
"id": "be9032643fe795a391fe8e54f84d5cff"
},
{
"type": "Feature",
"properties": {
"title": "Tabagie de la Place",
"address": "699 rue Saint Joseph Est",
"city": "Quebec City",
"province": "QC",
"postalcode": "G1K 3C1",
"phone": "(418) 529-7524",
"website": ""
},
"geometry": {
"coordinates": [
-71.220872,
46.81533
],
"type": "Point"
},
"id": "c1e334dc1995db095fe16cb793ac1f29"
},
{
"type": "Feature",
"properties": {
"title": "The Big Carrot",
"address": "348 Danforth Avenue",
"city": "Toronto",
"province": "ON",
"postalcode": "M4K 1N8",
"phone": "(416) 466-2129",
"website": "www.thebigcarrot.ca"
},
"geometry": {
"coordinates": [
-79.35276,
43.677573
],
"type": "Point"
},
"id": "c92c1c0f99fb696ecf235a604229aeb3"
},
{
"type": "Feature",
"properties": {
"title": "Rainbow Foods (Greenbank Hunt club Centre",
"address": "250 Greenbank Raod",
"city": "Nepean",
"province": "ON",
"postalcode": "K2H 8X4",
"phone": "(613) 820-3178",
"website": "www.rainbowfoods.ca"
},
"geometry": {
"coordinates": [
-75.780638,
45.324899
],
"type": "Point"
},
"id": "cd5a615e4e6793c3f44e54b84543fc0f"
},
{
"type": "Feature",
"properties": {
"title": "Foodland #6756 - Pape Mkt Toronto",
"address": "623 Danforth Ave",
"city": "Toronto",
"province": "ON ",
"postalcode": "M4K 1R2",
"phone": "(416) 433-5371",
"website": ""
},
"geometry": {
"coordinates": [
-79.345743,
43.678583
],
"type": "Point"
},
"id": "d031b38918c2fcbb8f8020e749f67aba"
},
{
"type": "Feature",
"properties": {
"title": "Good N Natural",
"address": "Unit A - 116 Park Road West",
"city": "Steinbach",
"province": "MB",
"postalcode": "R5G 1V6",
"phone": "204-326-9565",
"website": "https://www.goodnnatural.ca/"
},
"geometry": {
"coordinates": [
-96.690207,
49.544771
],
"type": "Point"
},
"id": "d0a67ce9e7fb560c9ad887f0fc495348"
},
{
"type": "Feature",
"properties": {
"title": "Eating Well Organically",
"address": "104 King St S",
"city": "Waterloo",
"province": "ON ",
"postalcode": "N2J 1P5",
"phone": "(519) 883-0734",
"website": ""
},
"geometry": {
"coordinates": [
-80.521538,
43.462855
],
"type": "Point"
},
"id": "d3cf4e1b7484a9bbdb8fa54fc62195bb"
},
{
"type": "Feature",
"properties": {
"title": "Ciboulette et Cie Inc.",
"address": "248 King St",
"city": "Midland",
"province": "ON ",
"postalcode": "L4R 3M3",
"phone": "(705) 245-0410",
"website": ""
},
"geometry": {
"coordinates": [
-79.886182,
44.75067
],
"type": "Point"
},
"id": "d56863b3c42b094d50440618fdcf1909"
},
{
"type": "Feature",
"properties": {
"title": "9158-9093 Québec Inc. (IGA #8012)",
"address": "105 boul Grand-Heron",
"city": "St-Jerome",
"province": "QC",
"postalcode": "J7Y 3P2",
"phone": "(450) 438-5214",
"website": ""
},
"geometry": {
"coordinates": [
-74.0407,
45.753761
],
"type": "Point"
},
"id": "d672d1c4d87df6b41fb4755aab58d875"
},
{
"type": "Feature",
"properties": {
"title": "King Drug and Home Healthcare",
"address": "145 Athabasca Avenue",
"city": "Hinton",
"province": "AB",
"postalcode": "T7V 2A4",
"phone": "(780) 865-2645",
"website": "http://www.kingdrug.ca/"
},
"geometry": {
"coordinates": [
-117.546975,
53.423846
],
"type": "Point"
},
"id": "d6843acf445abbb82a12222ebc30e722"
},
{
"type": "Feature",
"properties": {
"title": "Rainbow Foods (Britannia Plaza)",
"address": "1487 Richmond Raod",
"city": "Ottawa",
"province": "On",
"postalcode": "K2B 6R9",
"phone": "(613) 820-3178",
"website": "www.rainbowfoods.ca"
},
"geometry": {
"coordinates": [
-75.791107,
45.363
],
"type": "Point"
},
"id": "d7aa9c6400310a445115bf4b35d78fc2"
},
{
"type": "Feature",
"properties": {
"title": "Fiddleheads Health & Nutrition - Bruce St. Kitchener",
"address": "25 Bruce St",
"city": "Kitchener",
"province": "ON ",
"postalcode": "N2B 1Y4",
"phone": "",
"website": ""
},
"geometry": {
"coordinates": [
-80.469639,
43.462463
],
"type": "Point"
},
"id": "d91507c1d2fc415c2b515a0a5146a768"
},
{
"type": "Feature",
"properties": {
"title": "TNS Health Food - Cobourg",
"address": "1-1060 Burnham St",
"city": "Cobourg",
"province": "ON ",
"postalcode": "K9A 5V9",
"phone": "(905) 373-6009",
"website": ""
},
"geometry": {
"coordinates": [
-78.194249,
43.976822
],
"type": "Point"
},
"id": "da25fe6a2787fe0b3357d6be46827be0"
},
{
"type": "Feature",
"properties": {
"title": "Homeopathy London",
"address": "130 King St",
"city": "London",
"province": "ON ",
"postalcode": "N6A 1C5",
"phone": "(519) 673-4447",
"website": ""
},
"geometry": {
"coordinates": [
-81.250062,
42.982893
],
"type": "Point"
},
"id": "e0088951d1493a332e29e32815ccd4a4"
},
{
"type": "Feature",
"properties": {
"title": "Joanne's Place",
"address": "#7-84 Russell Street West",
"city": "Lindsay",
"province": "ON",
"postalcode": "K9V 6A5",
"phone": "(705) 328-3628",
"website": "www.joannesplace.ca"
},
"geometry": {
"coordinates": [
-78.74116,
44.352741
],
"type": "Point"
},
"id": "e92feda2d6afcae172fdd4847bd35658"
},
{
"type": "Feature",
"properties": {
"title": "Havaris Produce",
"address": "130 King St",
"city": "London",
"province": "ON ",
"postalcode": "N6A 1C5",
"phone": "(519) 672-4400",
"website": ""
},
"geometry": {
"coordinates": [
-81.250397,
42.98255
],
"type": "Point"
},
"id": "ed7187621fa349d61b621500c1a26e83"
},
{
"type": "Feature",
"properties": {
"title": "Natural Life Health Market",
"address": "7700 Bathurst Street",
"city": "Thornhill",
"province": "On",
"postalcode": "L4J 7Y3",
"phone": "(905) 707-3350",
"website": "http://naturallifemarket.com/"
},
"geometry": {
"coordinates": [
-79.450785,
43.810199
],
"type": "Point"
},
"id": "eed6785a76736b13e8310bb0260ac7d6"
},
{
"type": "Feature",
"properties": {
"title": "Magasin Co-op de Montmagny (IGA #367)",
"address": "70 Boulevard Taché O",
"city": "Montmagny",
"province": "QC",
"postalcode": "G5V 3A4",
"phone": "",
"website": ""
},
"geometry": {
"coordinates": [
-70.567483,
46.979672
],
"type": "Point"
},
"id": "f7af64f17d77084d2ef1fbb5b197257f"
},
{
"type": "Feature",
"properties": {
"title": "Go Organique",
"address": "3960 rue Belanger",
"city": "Montreal",
"province": "QC",
"postalcode": "H1X 1B7",
"phone": "(514) 729-2323",
"website": ""
},
"geometry": {
"coordinates": [
-73.590141,
45.564003
],
"type": "Point"
},
"id": "f85258f79e2b5411b05727b5eeb15546"
},
{
"type": "Feature",
"properties": {
"title": "Fresh From The Farm",
"address": "350 Donlands",
"city": "Toronto",
"province": "ON ",
"postalcode": "M4J 3S1",
"phone": "(416) 422-3276",
"website": ""
},
"geometry": {
"coordinates": [
-79.342771,
43.693296
],
"type": "Point"
},
"id": "f8d602b9d96fc74f9b67859d1b73c8e8"
},
{
"type": "Feature",
"properties": {
"title": "Pete's Fine Foods #2 - 3005732 Nova Scotia Ltd",
"address": "1595 Bedford Highway Sunnyside Mall",
"city": "Bedford",
"province": "NS",
"postalcode": "B4A 3Y4",
"phone": "(902) 835-4997",
"website": ""
},
"geometry": {
"coordinates": [
-63.655336,
44.731828
],
"type": "Point"
},
"id": "f93ef5d12c59765779b4c18bc4d78411"
},
{
"type": "Feature",
"properties": {
"title": "Buckingham Meats",
"address": "28 Buckingham Ave",
"city": "Oshawa",
"province": "ON ",
"postalcode": "L1G 2K3",
"phone": "(905) 725-2213",
"website": ""
},
"geometry": {
"coordinates": [
-78.870696,
43.910708
],
"type": "Point"
},
"id": "f997ebf858381fbbb144a608d8d3ded8"
},
{
"type": "Feature",
"properties": {
"title": "Strictly Bulk - Ossington",
"address": "924 Bloor St W",
"city": "Toronto",
"province": "ON ",
"postalcode": "M6H 1L4",
"phone": "(416) 533-3242",
"website": ""
},
"geometry": {
"coordinates": [
-79.427219,
43.661741
],
"type": "Point"
},
"id": "fa60a017f565fead0801167414821adc"
},
{
"type": "Feature",
"properties": {
"title": "Battaglia's Marketplace",
"address": "1150 Lorne Park Avenue",
"city": "Mississauga",
"province": "ON",
"postalcode": "L5H 3A5",
"phone": "(905) 271-3994",
"website": "www.battagliasmarketplace.com"
},
"geometry": {
"coordinates": [
-79.615672,
43.530727
],
"type": "Point"
},
"id": "fd821a024aa8a262dc921d538df70202"
}
],
"type": "FeatureCollection"
}
map.on('load', function (e) {
map.addSource("places", {
"type": "geojson",
"data": stores
});
buildLocationList(stores);
});
stores.features.forEach(function(marker, i) {
var el = document.createElement('div');
el.id = "marker-" + i;
el.className = 'marker';
el.style.left='-28px';
el.style.top='-46px';
new mapboxgl.Marker(el)
.setLngLat(marker.geometry.coordinates)
.addTo(map);
el.addEventListener('click', function(e){
flyToStore(marker);
createPopUp(marker);
var activeItem = document.getElementsByClassName('active');
e.stopPropagation();
if (activeItem[0]) {
activeItem[0].classList.remove('active');
}
var listing = document.getElementById('listing-' + i);
listing.classList.add('active');
});
});
function flyToStore(currentFeature) {
map.flyTo({
center: currentFeature.geometry.coordinates,
zoom: 15
});
}
function changePlaceholder(currentFeature) {
$('a').click(function() {
$('input[type=text]').attr('placeholder', currentFeature.properties.title);
});
}
function createPopUp(currentFeature) {
var popUps = document.getElementsByClassName('mapboxgl-popup');
if (popUps[0]) popUps[0].remove();
var popup = new mapboxgl.Popup()
.setLngLat(currentFeature.geometry.coordinates)
.setHTML('<h3>'+currentFeature.properties.title+'</h3>' +
'<h4>' + currentFeature.properties.address + " " + currentFeature.properties.city + '<br>' + currentFeature.properties.phone + '</h4>')
.addTo(map);
}
function buildLocationList(data) {
for (i = 0; i < data.features.length; i++) {
var currentFeature = data.features[i];
var prop = currentFeature.properties;
var listings = document.getElementById('listings');
var listing = listings.appendChild(document.createElement('div'));
listing.className = 'item';
listing.id = "listing-" + i;
layerIDs.push(listing);
var link = listing.appendChild(document.createElement('a'));
link.href = '#';
link.className = 'title';
link.dataPosition = i;
link.innerHTML = prop.title;
var details = listing.appendChild(document.createElement('div'));
details.innerHTML = prop.address;
details.innerHTML += ' &middot; ' + prop.city;
details.innerHTML += ' &middot; ' + prop.phone;
geoCon.addEventListener('keyup', function(e) {
var value = e.target.value.trim().toLowerCase();
console.log(currentFeature.properties.address);
currentFeature.properties.address.indexOf(value) > -1 ? 'visible' : 'none';
});
link.addEventListener('click', function(e) {
var clickedListing = data.features[this.dataPosition];
changePlaceholder(clickedListing);
flyToStore(clickedListing);
createPopUp(clickedListing);
var activeItem = document.getElementsByClassName('active');
if (activeItem[0]) {
activeItem[0].classList.remove('active');
}
this.parentNode.classList.add('active');
});
}
}
var layerIDs = [];
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment