US Office Maps
.mapboxgl-popup {
max-width: 350px;
font: 12px/20px ‘Helvetica Neue’, Arial, Helvetica, sans-serif;
}
h5{ font-size:13px; line-height: 12px; margin-bottom: 0;}
mapboxgl.accessToken = ‘pk.eyJ1Ijoid29ybGRyZWxpZWYiLCJhIjoiY2l3bW1xaWZwMDA4YzJ6cDdzaHZrMzhiNiJ9.ut4X4QmjiqLT2g2bw54wlg’;
var map = new mapboxgl.Map({
container: ‘map’,
style: ‘mapbox://styles/worldrelief/ciwwx1vgc00cz2qnyrdxsex56’,
center: [-98.04, 37.8],
zoom: 3.3
});
var mq = window.matchMedia( “(min-width: 420px)” );
if (mq.matches){
var map = new mapboxgl.Map({
container: ‘map’,
style: ‘mapbox://styles/worldrelief/ciwwx1vgc00cz2qnyrdxsex56’,
center: [-98.04, 37.8],
zoom: 3.2
});
} else {
var map = new mapboxgl.Map({
container: ‘map’,
style: ‘mapbox://styles/worldrelief/ciwwx1vgc00cz2qnyrdxsex56’,
center: [-98.04, 37.8],
zoom: 1.4
});
};
map.on(‘load’, function () {
// Add a GeoJSON source containing place coordinates and information.
map.addSource(“places”, {
“type”: “geojson”,
“data”: {
“type”: “FeatureCollection”,
“features”: [{
“type”: “Feature”,
“properties”: {
“description”: “
Arrive Ministries
1515 E 66th Street, Richfield, Minnesota
Website
“,
“icon”: “circle”
},
“geometry”: {
“type”: “Point”,
“coordinates”: [-93.25353, 44.88302]
}
}, {
“type”: “Feature”,
“properties”: {
“description”: “
World Relief Akron
647 E. Market Street Akron, OH 44304
Website
“,
“icon”: “circle”
},
“geometry”: {
“type”: “Point”,
“coordinates”: [-81.51765, 41.06102]
}
}, {
“type”: “Feature”,
“properties”: {
“description”: “
World Relief Anne Arundel
7678 Quarterfield Rd. Suite 201 Glen Burnie, MD 21061
Website
“,
“icon”: “circle”
},
“geometry”: {
“type”: “Point”,
“coordinates”: [-76.63705, 39.15043]
}
},{
“type”: “Feature”,
“properties”: {
“description”: “
World Relief Atlanta
647 E. Market Street Akron, OH 44304
Website
“,
“icon”: “circle”
},
“geometry”: {
“type”: “Point”,
“coordinates”: [-84.21269, 33.795]
}
}, {
“type”: “Feature”,
“properties”: {
“description”: “
World Relief Baltimore Immigration Clinic
7 E Baltimore Street, Baltimore, Maryland
Website
“,
“icon”: “circle”
},
“geometry”: {
“type”: “Point”,
“coordinates”: [-76.61465, 39.28926]
}
}, {
“type”: “Feature”,
“properties”: {
“description”: “
World Relief Boise
6702 Fairview Avenue, Boise, Idaho
Website
“,
“icon”: “circle”
},
“geometry”: {
“type”: “Point”,
“coordinates”: [-116.26511, 43.61953]
}
}, {
“type”: “Feature”,
“properties”: {
“description”: “
World Relief Chicago
3507 W Lawrence Avenue, Chicago, Illinois
Website
“,
“icon”: “circle”
},
“geometry”: {
“type”: “Point”,
“coordinates”: [-87.7162, 41.96817]
}
}, {
“type”: “Feature”,
“properties”: {
“description”: “
World Relief Columbus
4889 Sinclair Road, Columbus, Ohio
Website
“,
“icon”: “circle”
},
“geometry”: {
“type”: “Point”,
“coordinates”: [-82.99932,40.06599]
}
}, {
“type”: “Feature”,
“properties”: {
“description”: “
World Relief -Aurora – Aurora Office
73 S LaSalle Street, Aurora, Illinois;
Website
“,
“icon”: “marker-15”
},
“geometry”: {
“type”: “Point”,
“coordinates”: [-88.3139, 41.75498]
}
}, {
“type”: “Feature”,
“properties”: {
“description”: “
World Relief -Aurora – Wheaton Office
1825 College Avenue, Wheaton, Illinois
Website
“,
“icon”: “circle”
},
“geometry”: {
“type”: “Point”,
“coordinates”: [-88.08089, 41.8766]
}
}, {
“type”: “Feature”,
“properties”: {
“description”: “
World Relief Durham
801 Gilbert Street, Durham, North Carolina
Website
“,
“icon”: “circle”
},
“geometry”: {
“type”: “Point”,
“coordinates”: [-78.88934, 35.99611]
}
},{
“type”: “Feature”,
“properties”: {
“description”: “
World Relief Forth Worth
4059 Bryan Avenue, Fort Worth, Texas
Website
“,
“icon”: “circle”
},
“geometry”: {
“type”: “Point”,
“coordinates”: [-97.32456, 32.68887]
}
},{
“type”: “Feature”,
“properties”: {
“description”: “
World Relief Fox Valley – Appleton Office
2198 S. Memorial Drive, Appleton, Wisconsin;
Website
“,
“icon”: “circle”
},
“geometry”: {
“type”: “Point”,
“coordinates”: [-88.41878,44.24147 ]
}
}, {
“type”: “Feature”,
“properties”: {
“description”: “
World Relief Fox Valley – Oshkosh Office
115 Washington Avenue, Oshkosh, Wisconsin
Website
“,
“icon”: “circle”
},
“geometry”: {
“type”: “Point”,
“coordinates”: [-88.53518, 44.01755]
}
},{
“type”: “Feature”,
“properties”: {
“description”: “
World Relief Garden Grove
13121 Brookhurst Street, Garden Grove, California
Website
“,
“icon”: “circle”,
‘marker-color’: ‘#E80000’
},
“geometry”: {
“type”: “Point”,
“coordinates”: [-117.95611, 33.77169]
}
},{
“type”: “Feature”,
“properties”: {
“description”: “
World Relief High Point
155 Northpoint Avenue, High Point, North
Website
“,
“icon”: “circle”
},
“geometry”: {
“type”: “Point”,
“coordinates”: [-80.02248, 35.98838]
}
},{
“type”: “Feature”,
“properties”: {
“description”: “
World Relief Jacksonville
5107 W University Boulevard, Jacksonville, Florida
Website
“,
“icon”: “circle”
},
“geometry”: {
“type”: “Point”,
“coordinates”: [-81.61625, 30.26882]
}
},{
“type”: “Feature”,
“properties”: {
“description”: “
World Relief Memphis
3340 Poplar Avenue, Memphis, Tennessee
Website
“,
“icon”: “circle”
},
“geometry”: {
“type”: “Point”,
“coordinates”: [-89.95107,35.12968]
}
},{
“type”: “Feature”,
“properties”: {
“description”: “
World Relief Modesto
1401 F Street, Modesto, California
Website
“,
“icon”: “circle”
},
“geometry”: {
“type”: “Point”,
“coordinates”: [-120.99193, 37.63982]
}
},{
“type”: “Feature”,
“properties”: {
“description”: “
World Relief Moline
1852 16th Street, Moline, Illinois
Website
“,
“icon”: “circle”
},
“geometry”: {
“type”: “Point”,
“coordinates”: [-90.51332, 41.49339]
}
},{
“type”: “Feature”,
“properties”: {
“description”: “
World Relief Nashville
647 E. Market Street Akron, OH 44304
Website
“,
“icon”: “circle”
},
“geometry”: {
“type”: “Point”,
“coordinates”: [-86.74669, 36.1106]
}
},{
“type”: “Feature”,
“properties”: {
“description”: “
World Relief Phoenix
* Launching in 2017 *
“,
“icon”: “circle”
},
“geometry”: {
“type”: “Point”,
“coordinates”: [-111.89163, 33.41482]
}
},{
“type”: “Feature”,
“properties”: {
“description”: “
World Relief Sacramento
4616 Roseville Road, North Highlands, California
Website
“,
“icon”: “circle”
},
“geometry”: {
“type”: “Point”,
“coordinates”: [-121.38854, 38.65268]
}
},{
“type”: “Feature”,
“properties”: {
“description”: “
World Relief Seattle
841 Central Avenue N, Kent, Washington
Website
“,
“icon”: “circle”
},
“geometry”: {
“type”: “Point”,
“coordinates”: [-122.23171, 47.38977]
}
},{
“type”: “Feature”,
“properties”: {
“description”: “
World Relief Spartanburg
622 Alamo Street, Spartanburg, South Carolina
Website
“,
“icon”: “circle”
},
“geometry”: {
“type”: “Point”,
“coordinates”: [-81.96113, 34.97775 ]
}
}, {
“type”: “Feature”,
“properties”: {
“description”: “
World Relief Spokane
1522 N Washington Street, Spokane, Washington
Website
“,
“icon”: “circle”
},
“geometry”: {
“type”: “Point”,
“coordinates”: [-117.41669, 47.67186]
}
},{
“type”: “Feature”,
“properties”: {
“description”: “
World Relief Tri-Cities
2600 N Columbia Center Boulevard, Richland, Washington
Website
“,
“icon”: “circle”
},
“geometry”: {
“type”: “Point”,
“coordinates”: [ -119.22147, 46.23655]
}
}, {
“type”: “Feature”,
“properties”: {
“description”: “
World Relief Miami
2742 SW 8th Street, Miami, Florida;
Website
“,
“icon”: “circle”
},
“geometry”: {
“type”: “Point”,
“coordinates”: [ -80.2397, 25.76484]
}
}, {
“type”: “Feature”,
“properties”: {
“description”: “
World Relief Winston-Salem
545 Trade Street NW, Winston-Salem, North Carolina;
Website
“,
“icon”: “circle”
},
“geometry”: {
“type”: “Point”,
“coordinates”: [ -80.24584, 36.10111]
}
}]
}
});
// Add a layer showing the places.
map.addLayer({
“id”: “places”,
“type”: “symbol”,
“source”: “places”,
“layout”: {
“icon-image”: “marker-15”,
“icon-size” : 1.2,
“icon-allow-overlap”: true
},
“paint”: {
“icon-opacity”: 0.75
}
});
});
map.addControl(new mapboxgl.NavigationControl());
// When a click event occurs near a place, open a popup at the location of
// the feature, with description HTML from its properties.
map.on(‘click’, function (e) {
var features = map.queryRenderedFeatures(e.point, { layers: [‘places’] });
if (!features.length) {
return;
}
var feature = features[0];
// Populate the popup and set its coordinates
// based on the feature found.
var popup = new mapboxgl.Popup()
.setLngLat(feature.geometry.coordinates)
.setHTML(feature.properties.description)
.addTo(map);
});
// Use the same approach as above to indicate that the symbols are clickable
// by changing the cursor style to ‘pointer’.
map.on(‘mousemove’, function (e) {
var features = map.queryRenderedFeatures(e.point, { layers: [‘places’] });
map.getCanvas().style.cursor = (features.length) ? ‘pointer’ : ”;
});