I have created a JSON FeatureCollection that works in the DataLayer: Drag and Drop tutorial. It is just a collection of 2 roads so far, but I cannot figure out how to get the JSON file to load. It is a local file for now, so I thought calling it up and styling it ala tutorial would put me on the right path. But it isn't working. Here are the HTML and the JSON files.
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<title>FMRE Main Map</title>
<!-- Style Section for the Window -->
<style>
html { height: 610px; width: 575px; }
body { height: 610px; width:575px; margin: 0; padding: 0 }
#map-canvas { height: 604px; width: 566px;}
}
</style>
<!-- Calling the Google Map API version 3 -->
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>
<!-- Styling the Custom Main Map -->
<script>
var fmreMain = new google.maps.LatLng(29.681418,-95.714802);
var MY_MAPTYPE_ID = 'custom_style';
<!-- Styling for the Different Features on the Map from Google -->
function initialize() {
var featureOpts = [
{
"featureType": "poi.sports_complex",
"stylers": [
{ "visibility": "off" }
]
},
{
"featureType": "poi.attraction",
"stylers": [
{ "visibility": "off" }
]
},
{
"featureType": "poi.business",
"stylers": [
{ "visibility": "off" }
]
},
{
"featureType": "landscape.man_made",
"stylers": [
{ "visibility": "off" }
]
},
{
"featureType": "poi.medical",
"stylers": [
{ "visibility": "off" }
]
},
{
"featureType": "poi.government",
"stylers": [
{ "visibility": "off" }
]
},
{
"featureType": "poi.place_of_worship",
"stylers": [
{ "visibility": "off" }
]
},
{
"featureType": "poi.attraction",
"stylers": [
{ "visibility": "off" }
]
},
{
"featureType": "poi.park",
"stylers": [
{ "visibility": "off" }
]
},
{
"featureType": "poi.park",
"elementType": "labels.text",
"stylers": [
{ "visibility": "off" }
]
},
{
"featureType": "administrative.land_parcel",
"stylers": [
{ "visibility": "off" }
]
},
{
"featureType": "road.local",
"stylers": [
{ "visibility": "off" }
]
},
{
"featureType": "road.arterial",
"elementType": "labels.text",
"stylers": [
{ "visibility": "off" }
]
},
{
"featureType": "road.highway",
"elementType": "labels.icon",
"stylers": [
{ "visibility": "off" }
]
},
{
"featureType": "road.highway",
"elementType": "labels.text",
"stylers": [
{ "visibility": "off" }
]
},
{
"featureType": "road.highway",
"elementType": "geometry",
"stylers": [
{ "visibility": "off" }
]
},
{
"featureType": "road.arterial",
"elementType": "geometry",
"stylers": [
{ "visibility": "off" }
]
},
{
"featureType": "road.arterial",
"elementType": "labels.text",
"stylers": [
{ "visibility": "off" }
]
},
{
"featureType": "road.arterial",
"elementType": "labels.icon",
"stylers": [
{ "visibility": "off" }
]
},
{
"featureType": "water",
"elementType": "labels.text",
"stylers": [
{ "visibility": "off" }
]
},
{
"featureType": "water",
"stylers": [
{ "color": "#0000ff" }
]
},
{
"featureType": "landscape.natural.landcover",
"stylers": [
{ "visibility": "off" }
]
},
{
"featureType": "landscape.natural.terrain",
"stylers": [
{ "visibility": "off" }
]
},
{
"featureType": "administrative.locality",
"stylers": [
{ "visibility": "off" }
]
},
{
"featureType": "administrative.neighborhood",
"stylers": [
{ "visibility": "off" }
]
}
];
<!-- Setting for the Main Map -->
var mapOptions = {
center: fmreMain,
backgroundColor: "#330033",
zoom: 11,
maxZoom: 12,
minZoom: 10,
zoomControl: false,
mapTypeControl: false,
streetViewControl: false,
panControl: false,
mapTypeId: MY_MAPTYPE_ID
};
map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
<!-- Settings for the Custom View Box -->
var styledMapOptions = {
name: 'FMRE',
alt: 'Katy Areas'
};
var customMapType = new google.maps.StyledMapType(featureOpts, styledMapOptions);
map.data.loadGeoJson('\JSON_MAP_COMPONENTS\Area_Main_Roads.json');
var featureStyle = {
strokeColor: '#ff3333',
strokeWeight: 4
}
map.data.setStyle(featureStyle);
map.mapTypes.set(MY_MAPTYPE_ID, customMapType, featureStyle);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="map-canvas"></div>
</body>
</html>
GeoJSON File
{ "type": "FeatureCollection",
"features": [
{ "type": "Feature",
"geometry":
{ "type": "LineString", "coordinates": [
[ -95.499287099037943, 29.633775903201652 ],
[ -95.510219429084501, 29.6295756444228 ],
[ -95.518154168081537, 29.62651674184098 ],
[ -95.528712867431707, 29.622445431000013 ],
[ -95.53826064293483, 29.618771022138741 ],
[ -95.541035517360555, 29.617702728232437 ],
[ -95.544447072307435, 29.616381372726607 ],
[ -95.544625899177007, 29.616307579994842 ],
[ -95.545790211351189, 29.61607301050708 ],
[ -95.547077549792974, 29.615738432024486 ],
[ -95.547631713233685, 29.615622392826097 ],
[ -95.547932671532564, 29.614939407889889 ],
[ -95.548190053370064, 29.615522451738965 ],
[ -95.548392624456909, 29.614769174869338 ],
[ -95.548751780273136, 29.615438758779774 ],
[ -95.548862903461526, 29.614619498527343 ],
[ -95.549316099095989, 29.615371466668105 ],
[ -95.549340348276871, 29.614490639557527 ],
[ -95.5498249417235, 29.614383114417095 ],
[ -95.549883013326678, 29.615320575455101 ],
[ -95.550315113633715, 29.614296882540973 ],
[ -95.550453893576616, 29.615268752955089 ],
[ -95.55080927908358, 29.614232245311893 ],
[ -95.55102561034731, 29.615238786782307 ],
[ -95.551307430876705, 29.614189377168234 ],
[ -95.551598948336235, 29.615230699957547 ],
[ -95.551806412103673, 29.614168537600264 ],
[ -95.552172327563156, 29.615244792636013 ],
[ -95.552307012242224, 29.614169749750467 ],
[ -95.552763416973363, 29.615270518318706 ],
[ -95.553058820618347, 29.614214575493488 ],
[ -95.553353931280569, 29.615313248914024 ],
[ -95.553809129103215, 29.614280510927649 ],
[ -95.553942307619963, 29.615372775130719 ],
[ -95.554557172864406, 29.614367016572341 ],
[ -95.554528537407847, 29.615449264399285 ],
[ -95.555111047097768, 29.615542680453746 ],
[ -95.555301363729981, 29.614474399507031 ],
[ -95.555689851816069, 29.615652678600238 ],
[ -95.556040927782462, 29.614602293331057 ],
[ -95.556264162521359, 29.615779239979805 ],
[ -95.556775872895187, 29.614750525044794 ],
[ -95.556914987297333, 29.615947833035133 ],
[ -95.557513696889401, 29.61495351117193 ],
[ -95.557558910652602, 29.616134470634488 ],
[ -95.558195929479282, 29.616339158422026 ],
[ -95.558244516212099, 29.615177634544775 ],
[ -95.55882527144017, 29.616561525865681 ],
[ -95.558965972396251, 29.615422665572016 ],
[ -95.559446153132754, 29.616801386697823 ],
[ -95.559678076574173, 29.615688428594837 ],
[ -95.56005779629821, 29.617058544935759 ],
[ -95.560379265263265, 29.615974542661295 ],
[ -95.560660212691673, 29.6173326586934 ],
[ -95.561069548740193, 29.616280664480282 ],
[ -95.561251836156302, 29.617623517388921 ],
[ -95.561747370087133, 29.616606407670673 ],
[ -95.562413519747608, 29.616951622268932 ],
[ -95.563065649760588, 29.617315904414909 ],
[ -95.563703776057594, 29.617698739141304 ],
[ -95.56462444620395, 29.618434632015283 ],
[ -95.564638543026348, 29.6192325281466 ],
[ -95.564638543026348, 29.6192325281466 ],
[ -95.565080417160374, 29.618780282365936 ],
[ -95.565514827960186, 29.619111791125349 ],
[ -95.565963136743335, 29.619428009036451 ],
[ -95.566426136988952, 29.619728781651517 ],
[ -95.566519062703364, 29.620125805523074 ],
[ -95.56690227793402, 29.620013381609613 ],
[ -95.567390000454211, 29.620281425067887 ],
[ -95.568576457132423, 29.621074319946569 ],
[ -95.578485692451835, 29.625641315413901 ],
[ -95.582059571463262, 29.627295409183905 ],
[ -95.582617864632084, 29.627503465784848 ],
[ -95.583183011429838, 29.627695016524143 ],
[ -95.583755809341227, 29.62786973515307 ],
[ -95.58433468413331, 29.628027584218472 ],
[ -95.584919639771357, 29.628168389078326 ],
[ -95.585509904497698, 29.628291787667514 ],
[ -95.5861038967318, 29.62839791284178 ],
[ -95.586701627753513, 29.628486418319529 ],
[ -95.5873509877663, 29.628561276422992 ],
[ -95.588003404720268, 29.628615404919724 ],
[ -95.588657308534394, 29.628648589079546 ],
[ -95.589311906879814, 29.62866098196168 ],
[ -95.589967209257679, 29.628652238688996 ],
[ -95.590621634725139, 29.62862266269488 ],
[ -95.59127360570767, 29.628572215226772 ],
[ -95.591923911225422, 29.628500915015181 ],
[ -95.592570183447307, 29.628408875067063 ],
[ -95.593022365434578, 29.628329427128524 ],
[ -95.593212423695576, 29.628296092665561 ],
[ -95.593849824907792, 29.628163067126376 ],
[ -95.602800151029271, 29.626368306235111 ],
[ -95.610891907803705, 29.624767694460097 ],
[ -95.625224916235595, 29.621939980261459 ],
[ -95.634517408208879, 29.620070079842652 ],
[ -95.635014643769196, 29.619982856001396 ],
[ -95.635506248525559, 29.619875372000127 ],
[ -95.635992202157595, 29.619748138730863 ],
[ -95.636470931269827, 29.619601292790396 ],
[ -95.636940847307386, 29.619435138043109 ],
[ -95.638217695436722, 29.618980092021609 ],
[ -95.644537160190339, 29.61593975812249 ],
[ -95.64960728492747, 29.613468133017431 ],
[ -95.65397244331723, 29.61134013018523 ],
[ -95.658734971501758, 29.609017636540109 ],
[ -95.659466967381306, 29.608705257324765 ],
[ -95.664612770257676, 29.60678590420169 ],
[ -95.668899343482266, 29.605238729038675 ],
[ -95.673659861122317, 29.603514234231668 ],
[ -95.674279320628358, 29.603295442145924 ],
[ -95.674907530204976, 29.603097842026244 ],
[ -95.675543707446778, 29.602921414302404 ],
[ -95.676187839833972, 29.602766505066402 ],
[ -95.676837557108954, 29.60263339761941 ],
[ -95.67749364733173, 29.602522108625568 ],
[ -95.678152946896418, 29.602433080627023 ],
[ -95.678816242279922, 29.602366330273291 ],
[ -95.679629410164338, 29.602265123824868 ],
[ -95.680438556809278, 29.602142318442688 ],
[ -95.681243680105766, 29.601997914157767 ],
[ -95.682042408873755, 29.601832197361649 ],
[ -95.682524911891221, 29.601758191155536 ],
[ -95.684382714550139, 29.60155287116272 ],
[ -95.686148878959756, 29.60135780522381 ],
[ -95.687394682172112, 29.601311978523462 ],
[ -95.688868539646464, 29.601271959226128 ],
[ -95.690151710856952, 29.601165818517412 ],
[ -95.698436609669059, 29.600298147924665 ],
[ -95.712948752171997, 29.59875592069745 ],
[ -95.727425360877163, 29.59722673715499 ],
[ -95.730063955308495, 29.596938957087566 ],
[ -95.733949727649971, 29.596558989801441 ],
[ -95.734716388953416, 29.596481248015291 ],
[ -95.735480483982258, 29.596385213220991 ],
[ -95.736241235157195, 29.596270693242214 ],
[ -95.736997847446304, 29.596137840603774 ],
[ -95.737749521913926, 29.59598698101151 ],
[ -95.73849705276551, 29.595817963476087 ],
[ -95.739238860822695, 29.595630917208315 ],
[ -95.73968443239518, 29.595503361007395 ],
[ -95.740122787199525, 29.595355337874917 ],
[ -95.740550761628128, 29.595187287767285 ],
[ -95.740968339140522, 29.594999723117724 ],
[ -95.741374717120607, 29.594793142843816 ],
[ -95.741766726672736, 29.594568155863318 ],
[ -95.742093732206811, 29.594357919000753 ],
[ -95.742508361097521, 29.594065218109517 ],
[ -95.742855573975135, 29.593788755497702 ],
[ -95.750206098838916, 29.587548561310111 ],
[ -95.751466043158246, 29.586506730798465 ],
[ -95.751857497869452, 29.586223240166547 ],
[ -95.752919092797981, 29.585454276032923 ],
[ -95.752332555445463, 29.586032739095078 ],
[ -95.752781576627385, 29.585819596241389 ],
[ -95.753240303706107, 29.585622849869605 ],
[ -95.753708727547192, 29.585442843356951 ],
[ -95.754232524054274, 29.585327974696803 ],
[ -95.754419439776129, 29.584571635851244 ],
[ -95.754752115637473, 29.585196836809061 ],
[ -95.755265130273273, 29.585049720136446 ],
[ -95.755720322722468, 29.583898388332575 ],
[ -95.755773130277575, 29.58488700212299 ],
[ -95.756272977435572, 29.584708437697859 ],
[ -95.75891159982973, 29.582198694619247 ],
[ -95.75906409080406, 29.582129484034105 ],
[ -95.759225393537392, 29.582080088954392 ],
[ -95.75927259966933, 29.582973477205726 ],
[ -95.759393901483193, 29.582051676194759 ],
[ -95.75956486788715, 29.582044985761208 ],
[ -95.759735932037046, 29.58205996468255 ],
[ -95.759902380762256, 29.582096497382661 ],
[ -95.760060305871676, 29.582153628555439 ],
[ -95.76020817712552, 29.582230118214955 ],
[ -95.760357528359791, 29.582284634055643 ],
[ -95.760514581097794, 29.582319734057446 ],
[ -95.760675408970371, 29.582334979412288 ],
[ -95.760849516833545, 29.582353297161845 ],
[ -95.760959473467196, 29.582310223675165 ],
[ -95.761150730824212, 29.582259144313557 ],
[ -95.761295968859798, 29.58219525903268 ],
[ -95.765552916998928, 29.580582433023139 ],
[ -95.767076118205168, 29.579966382782494 ],
[ -95.768940736875379, 29.579202955841627 ],
[ -95.769483236697695, 29.578992703569618 ],
[ -95.769997353311567, 29.578734306430583 ],
[ -95.770477495042314, 29.578430549788173 ],
[ -95.770501802324446, 29.578411530287852 ],
[ -95.770919621229197, 29.578084608651736 ],
[ -95.771317318501048, 29.577700450164933 ],
[ -95.771668089531943, 29.577282144469216 ],
[ -95.771966292450813, 29.576834195707111 ],
[ -95.773099190489546, 29.574945349522867 ],
[ -95.774064863551587, 29.573367639187669 ],
[ -95.774723904953774, 29.57240515181789 ],
[ -95.776611536181179, 29.570631460929519 ],
[ -95.780736452570778, 29.566817647533409 ],
[ -95.785517680620927, 29.562412860334042 ],
[ -95.786727193299015, 29.561301919475817 ],
[ -95.787283531731745, 29.56087235224237 ],
[ -95.787870323208821, 29.56047498103619 ],
[ -95.788485142993864, 29.560111809430662 ],
[ -95.789125585802864, 29.559784328756468 ],
[ -95.789789254084369, 29.559493685448658 ],
[ -95.79047296270376, 29.559241174696368 ],
[ -95.791231046099909, 29.559000077095959 ],
[ -95.792006569278925, 29.558804787300932 ],
[ -95.792404626619032, 29.558729911970136 ],
[ -95.792795562398197, 29.558656412734425 ],
[ -95.793594076568965, 29.558555550083788 ],
[ -95.794398954219844, 29.558502636200263 ],
[ -95.80262437541198, 29.558360041418904 ],
[ -95.80886477983374, 29.558222529246301 ],
[ -95.8107218610362, 29.55818156452592 ],
[ -95.816922824807619, 29.558046345186472 ],
[ -95.817265073981048, 29.558095590863523 ],
[ -95.817597531863811, 29.558181398005637 ],
[ -95.817836213232013, 29.558272366670142 ],
[ -95.817915512085534, 29.558302625483968 ],
[ -95.818213581157977, 29.558457080526612 ],
[ -95.819194084814839, 29.559054548455535 ],
[ -95.819497850086577, 29.55920294521766 ],
[ -95.819746221093439, 29.559286059686418 ],
[ -95.81982329796827, 29.559311965459216 ],
[ -95.820162627658732, 29.55937935996042 ],
[ -95.820509582324561, 29.559403948782403 ],
[ -95.820857889108325, 29.55938506580496 ],
[ -95.824718063094679, 29.558959426854781 ],
[ -95.831361084271393, 29.558192160024365 ],
[ -95.844477944847185, 29.556699418003522 ],
[ -95.85819677636924, 29.555135983488686 ],
[ -95.871929703883254, 29.553559444692421 ],
[ -95.88329102370966, 29.552248793884623 ],
[ -95.888322559339912, 29.55167222500237 ],
[ -95.892815691972388, 29.551157061377207 ],
[ -95.897736248978021, 29.550578763556558 ],
[ -95.910399305959999, 29.549116867213961 ],
[ -95.923855636410593, 29.547576437107175 ],
[ -95.937298627214119, 29.546046220812695 ],
[ -95.945273176362306, 29.54514221201439 ],
[ -95.951137220130576, 29.544476059357219 ],
[ -95.964236136938482, 29.543007002970786 ],
[ -95.970188404070598, 29.542353888884303 ],
[ -95.975688436918546, 29.541750285267089 ],
[ -95.987234139258348, 29.540462888259988 ],
[ -95.989329192556497, 29.540230695528845 ],
[ -95.991688089357012, 29.539959187914096 ],
[ -96.000130574944478, 29.538993683647849 ],
[ -96.014157906295239, 29.537433042387075 ],
[ -96.027336767808151, 29.535959535239698 ],
[ -96.041364054438176, 29.534396055545262 ],
[ -96.048154640748862, 29.533570949334194 ],
[ -96.055404650675584, 29.532808847648162 ]
]
},
"properties": {
"name": "US90A"
}
},
{ "type": "Feature",
"geometry":
{ "type": "LineString", "coordinates": [
[ -95.443899579354223, 29.596551757594483 ],
[ -95.450711550556974, 29.596484410458228 ],
[ -95.45277832877342, 29.596462723335119 ],
[ -95.45356724676536, 29.596499811907325 ],
[ -95.454353644075795, 29.596564170654567 ],
[ -95.455136735454545, 29.596655778795721 ],
[ -95.45591495406353, 29.59677442440762 ],
[ -95.456686734752026, 29.596919892830492 ],
[ -95.457381279038472, 29.59709116724034 ],
[ -95.458067954181161, 29.597285101420141 ],
[ -95.458745995832203, 29.597501158248217 ],
[ -95.459414622832455, 29.597739145305841 ],
[ -95.460072268112356, 29.597998849392376 ],
[ -95.460718162351412, 29.598279734717035 ],
[ -95.461351533466939, 29.598581437290846 ],
[ -95.463276789092376, 29.599511264356774 ],
[ -95.464685045741405, 29.600188541465812 ],
[ -95.46854040288855, 29.601866776479294 ],
[ -95.473923714541257, 29.604273032904768 ],
[ -95.476934942436216, 29.605718447810595 ],
[ -95.480400133276476, 29.607309524771566 ],
[ -95.483843080659824, 29.608909555267655 ],
[ -95.486513278910948, 29.610116556280001 ],
[ -95.489106794010056, 29.611312031891693 ],
[ -95.493886416648991, 29.613552388324642 ],
[ -95.495670092148671, 29.61438838323145 ],
[ -95.496562499795544, 29.6148320294066 ],
[ -95.500388952514228, 29.617062606614923 ],
[ -95.501303319592438, 29.617555805086603 ],
[ -95.502232662657988, 29.618025656379043 ],
[ -95.503177768799176, 29.618472184994413 ],
[ -95.504137084846761, 29.618894830235377 ],
[ -95.505109046665112, 29.619293208653353 ],
[ -95.506094454690611, 29.619666998584208 ],
[ -95.510863881626875, 29.621520540100246 ],
[ -95.511482803464602, 29.62179255826964 ],
[ -95.512088445235847, 29.622084688405721 ],
[ -95.512681608069855, 29.622396612064549 ],
[ -95.513260731305806, 29.622727768933142 ],
[ -95.513825827437429, 29.623077987650749 ],
[ -95.514374555254321, 29.623446522783393 ],
[ -95.514906935766419, 29.623832856677883 ],
[ -95.516322721289569, 29.624977836241506 ],
[ -95.518154168081537, 29.62651674184098 ],
[ -95.520811518798681, 29.628749287154772 ],
[ -95.524148403078357, 29.631583919128758 ],
[ -95.537081997353297, 29.642482136629464 ]
]
},
"properties": {
"name": "beltway8"
}
}
]
}
With the Data layer, you can add GeoJSON data to a Google map in just one line of code. map. data. loadGeoJson('google.
Introduction. GeoJSON is an extension of the JSON data format and represents geographical data. Using this utility, you can store geographical features in GeoJSON format and render them as a layer on top of the map.
I wouldn't expect loadGeoJSON to work with a local file (for security reasons most browsers prohibit access to the local filesystem by default). If you want to use local data, use the addGeoJSON method:
var data = {... your GeoJSON ...};
map.data.addGeoJson(data);
var featureStyle = {
strokeColor: '#ff3333',
strokeWeight: 4
}
map.data.setStyle(featureStyle);
working fiddle
This works for me on my local computer in Chrome:
in the head (SO_20140815_data.js is below):
<!-- Calling the Google Map API version 3 -->
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>
<script src="SO_20140815_data.js"></script>
at the end of initialize
map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
<!-- Settings for the Custom View Box -->
var styledMapOptions = {
name: 'FMRE',
alt: 'Katy Areas'
};
var customMapType = new google.maps.StyledMapType(featureOpts, styledMapOptions);
map.data.addGeoJson(data);
var featureStyle = {
strokeColor: '#ff3333',
strokeWeight: 4
}
map.data.setStyle(featureStyle);
map.mapTypes.set(MY_MAPTYPE_ID, customMapType, featureStyle);
SO_20140815_data.js
var data = { "type": "FeatureCollection",
"features": [
{ "type": "Feature",
"geometry":
{ "type": "LineString",
"coordinates": [[ -95.499287099037943, 29.633775903201652 ],[ -95.510219429084501, 29.6295756444228 ],[ -95.518154168081537, 29.62651674184098 ],[ -95.528712867431707, 29.622445431000013 ],[ -95.53826064293483, 29.618771022138741 ],[ -95.541035517360555, 29.617702728232437 ],[ -95.544447072307435, 29.616381372726607 ],[ -95.544625899177007, 29.616307579994842 ],[ -95.545790211351189, 29.61607301050708 ],[ -95.547077549792974, 29.615738432024486 ],[ -95.547631713233685, 29.615622392826097 ],[ -95.547932671532564, 29.614939407889889 ],[ -95.548190053370064, 29.615522451738965 ],[ -95.548392624456909, 29.614769174869338 ],[ -95.548751780273136, 29.615438758779774 ],[ -95.548862903461526, 29.614619498527343 ],[ -95.549316099095989, 29.615371466668105 ],[ -95.549340348276871, 29.614490639557527 ],[ -95.5498249417235, 29.614383114417095 ],[ -95.549883013326678, 29.615320575455101 ],[ -95.550315113633715, 29.614296882540973 ],[ -95.550453893576616, 29.615268752955089 ],[ -95.55080927908358, 29.614232245311893 ],[ -95.55102561034731, 29.615238786782307 ],[ -95.551307430876705, 29.614189377168234 ],[ -95.551598948336235, 29.615230699957547 ],[ -95.551806412103673, 29.614168537600264 ],[ -95.552172327563156, 29.615244792636013 ],[ -95.552307012242224, 29.614169749750467 ],[ -95.552763416973363, 29.615270518318706 ],[ -95.553058820618347, 29.614214575493488 ],[ -95.553353931280569, 29.615313248914024 ],[ -95.553809129103215, 29.614280510927649 ],[ -95.553942307619963, 29.615372775130719 ],[ -95.554557172864406, 29.614367016572341 ],[ -95.554528537407847, 29.615449264399285 ],[ -95.555111047097768, 29.615542680453746 ],[ -95.555301363729981, 29.614474399507031 ],[ -95.555689851816069, 29.615652678600238 ],[ -95.556040927782462, 29.614602293331057 ],[ -95.556264162521359, 29.615779239979805 ],[ -95.556775872895187, 29.614750525044794 ],[ -95.556914987297333, 29.615947833035133 ],[ -95.557513696889401, 29.61495351117193 ],[ -95.557558910652602, 29.616134470634488 ],[ -95.558195929479282, 29.616339158422026 ],[ -95.558244516212099, 29.615177634544775 ],[ -95.55882527144017, 29.616561525865681 ],[ -95.558965972396251, 29.615422665572016 ],[ -95.559446153132754, 29.616801386697823 ],[ -95.559678076574173, 29.615688428594837 ],[ -95.56005779629821, 29.617058544935759 ],[ -95.560379265263265, 29.615974542661295 ],[ -95.560660212691673, 29.6173326586934 ],[ -95.561069548740193, 29.616280664480282 ],[ -95.561251836156302, 29.617623517388921 ],[ -95.561747370087133, 29.616606407670673 ],[ -95.562413519747608, 29.616951622268932 ],[ -95.563065649760588, 29.617315904414909 ],[ -95.563703776057594, 29.617698739141304 ],[ -95.56462444620395, 29.618434632015283 ],[ -95.564638543026348, 29.6192325281466 ],[ -95.564638543026348, 29.6192325281466 ],[ -95.565080417160374, 29.618780282365936 ],[ -95.565514827960186, 29.619111791125349 ],[ -95.565963136743335, 29.619428009036451 ],[ -95.566426136988952, 29.619728781651517 ],[ -95.566519062703364, 29.620125805523074 ],[ -95.56690227793402, 29.620013381609613 ],[ -95.567390000454211, 29.620281425067887 ],[ -95.568576457132423, 29.621074319946569 ],[ -95.578485692451835, 29.625641315413901 ],[ -95.582059571463262, 29.627295409183905 ],[ -95.582617864632084, 29.627503465784848 ],[ -95.583183011429838, 29.627695016524143 ],[ -95.583755809341227, 29.62786973515307 ],[ -95.58433468413331, 29.628027584218472 ],[ -95.584919639771357, 29.628168389078326 ],[ -95.585509904497698, 29.628291787667514 ],[ -95.5861038967318, 29.62839791284178 ],[ -95.586701627753513, 29.628486418319529 ],[ -95.5873509877663, 29.628561276422992 ],[ -95.588003404720268, 29.628615404919724 ],[ -95.588657308534394, 29.628648589079546 ],[ -95.589311906879814, 29.62866098196168 ],[ -95.589967209257679, 29.628652238688996 ],[ -95.590621634725139, 29.62862266269488 ],[ -95.59127360570767, 29.628572215226772 ],[ -95.591923911225422, 29.628500915015181 ],[ -95.592570183447307, 29.628408875067063 ],[ -95.593022365434578, 29.628329427128524 ],[ -95.593212423695576, 29.628296092665561 ],[ -95.593849824907792, 29.628163067126376 ],[ -95.602800151029271, 29.626368306235111 ],[ -95.610891907803705, 29.624767694460097 ],[ -95.625224916235595, 29.621939980261459 ],[ -95.634517408208879, 29.620070079842652 ],[ -95.635014643769196, 29.619982856001396 ],[ -95.635506248525559, 29.619875372000127 ],[ -95.635992202157595, 29.619748138730863 ],[ -95.636470931269827, 29.619601292790396 ],[ -95.636940847307386, 29.619435138043109 ],[ -95.638217695436722, 29.618980092021609 ],[ -95.644537160190339, 29.61593975812249 ],[ -95.64960728492747, 29.613468133017431 ],[ -95.65397244331723, 29.61134013018523 ],[ -95.658734971501758, 29.609017636540109 ],[ -95.659466967381306, 29.608705257324765 ],[ -95.664612770257676, 29.60678590420169 ],[ -95.668899343482266, 29.605238729038675 ],[ -95.673659861122317, 29.603514234231668 ],[ -95.674279320628358, 29.603295442145924 ],[ -95.674907530204976, 29.603097842026244 ],[ -95.675543707446778, 29.602921414302404 ],[ -95.676187839833972, 29.602766505066402 ],[ -95.676837557108954, 29.60263339761941 ],[ -95.67749364733173, 29.602522108625568 ],[ -95.678152946896418, 29.602433080627023 ],[ -95.678816242279922, 29.602366330273291 ],[ -95.679629410164338, 29.602265123824868 ],[ -95.680438556809278, 29.602142318442688 ],[ -95.681243680105766, 29.601997914157767 ],[ -95.682042408873755, 29.601832197361649 ],[ -95.682524911891221, 29.601758191155536 ],[ -95.684382714550139, 29.60155287116272 ],[ -95.686148878959756, 29.60135780522381 ],[ -95.687394682172112, 29.601311978523462 ],[ -95.688868539646464, 29.601271959226128 ],[ -95.690151710856952, 29.601165818517412 ],[ -95.698436609669059, 29.600298147924665 ],[ -95.712948752171997, 29.59875592069745 ],[ -95.727425360877163, 29.59722673715499 ],[ -95.730063955308495, 29.596938957087566 ],[ -95.733949727649971, 29.596558989801441 ],[ -95.734716388953416, 29.596481248015291 ],[ -95.735480483982258, 29.596385213220991 ],[ -95.736241235157195, 29.596270693242214 ],[ -95.736997847446304, 29.596137840603774 ],[ -95.737749521913926, 29.59598698101151 ],[ -95.73849705276551, 29.595817963476087 ],[ -95.739238860822695, 29.595630917208315 ],[ -95.73968443239518, 29.595503361007395 ],[ -95.740122787199525, 29.595355337874917 ],[ -95.740550761628128, 29.595187287767285 ],[ -95.740968339140522, 29.594999723117724 ],[ -95.741374717120607, 29.594793142843816 ],[ -95.741766726672736, 29.594568155863318 ],[ -95.742093732206811, 29.594357919000753 ],[ -95.742508361097521, 29.594065218109517 ],[ -95.742855573975135, 29.593788755497702 ],[ -95.750206098838916, 29.587548561310111 ],[ -95.751466043158246, 29.586506730798465 ],[ -95.751857497869452, 29.586223240166547 ],[ -95.752919092797981, 29.585454276032923 ],[ -95.752332555445463, 29.586032739095078 ],[ -95.752781576627385, 29.585819596241389 ],[ -95.753240303706107, 29.585622849869605 ],[ -95.753708727547192, 29.585442843356951 ],[ -95.754232524054274, 29.585327974696803 ],[ -95.754419439776129, 29.584571635851244 ],[ -95.754752115637473, 29.585196836809061 ],[ -95.755265130273273, 29.585049720136446 ],[ -95.755720322722468, 29.583898388332575 ],[ -95.755773130277575, 29.58488700212299 ],[ -95.756272977435572, 29.584708437697859 ],[ -95.75891159982973, 29.582198694619247 ],[ -95.75906409080406, 29.582129484034105 ],[ -95.759225393537392, 29.582080088954392 ],[ -95.75927259966933, 29.582973477205726 ],[ -95.759393901483193, 29.582051676194759 ],[ -95.75956486788715, 29.582044985761208 ],[ -95.759735932037046, 29.58205996468255 ],[ -95.759902380762256, 29.582096497382661 ],[ -95.760060305871676, 29.582153628555439 ],[ -95.76020817712552, 29.582230118214955 ],[ -95.760357528359791, 29.582284634055643 ],[ -95.760514581097794, 29.582319734057446 ],[ -95.760675408970371, 29.582334979412288 ],[ -95.760849516833545, 29.582353297161845 ],[ -95.760959473467196, 29.582310223675165 ],[ -95.761150730824212, 29.582259144313557 ],[ -95.761295968859798, 29.58219525903268 ],[ -95.765552916998928, 29.580582433023139 ],[ -95.767076118205168, 29.579966382782494 ],[ -95.768940736875379, 29.579202955841627 ],[ -95.769483236697695, 29.578992703569618 ],[ -95.769997353311567, 29.578734306430583 ],[ -95.770477495042314, 29.578430549788173 ],[ -95.770501802324446, 29.578411530287852 ],[ -95.770919621229197, 29.578084608651736 ],[ -95.771317318501048, 29.577700450164933 ],[ -95.771668089531943, 29.577282144469216 ],[ -95.771966292450813, 29.576834195707111 ],[ -95.773099190489546, 29.574945349522867 ],[ -95.774064863551587, 29.573367639187669 ],[ -95.774723904953774, 29.57240515181789 ],[ -95.776611536181179, 29.570631460929519 ],[ -95.780736452570778, 29.566817647533409 ],[ -95.785517680620927, 29.562412860334042 ],[ -95.786727193299015, 29.561301919475817 ],[ -95.787283531731745, 29.56087235224237 ],[ -95.787870323208821, 29.56047498103619 ],[ -95.788485142993864, 29.560111809430662 ],[ -95.789125585802864, 29.559784328756468 ],[ -95.789789254084369, 29.559493685448658 ],[ -95.79047296270376, 29.559241174696368 ],[ -95.791231046099909, 29.559000077095959 ],[ -95.792006569278925, 29.558804787300932 ],[ -95.792404626619032, 29.558729911970136 ],[ -95.792795562398197, 29.558656412734425 ],[ -95.793594076568965, 29.558555550083788 ],[ -95.794398954219844, 29.558502636200263 ],[ -95.80262437541198, 29.558360041418904 ],[ -95.80886477983374, 29.558222529246301 ],[ -95.8107218610362, 29.55818156452592 ],[ -95.816922824807619, 29.558046345186472 ],[ -95.817265073981048, 29.558095590863523 ],[ -95.817597531863811, 29.558181398005637 ],[ -95.817836213232013, 29.558272366670142 ],[ -95.817915512085534, 29.558302625483968 ],[ -95.818213581157977, 29.558457080526612 ],[ -95.819194084814839, 29.559054548455535 ],[ -95.819497850086577, 29.55920294521766 ],[ -95.819746221093439, 29.559286059686418 ],[ -95.81982329796827, 29.559311965459216 ],[ -95.820162627658732, 29.55937935996042 ],[ -95.820509582324561, 29.559403948782403 ],[ -95.820857889108325, 29.55938506580496 ],[ -95.824718063094679, 29.558959426854781 ],[ -95.831361084271393, 29.558192160024365 ],[ -95.844477944847185, 29.556699418003522 ],[ -95.85819677636924, 29.555135983488686 ],[ -95.871929703883254, 29.553559444692421 ],[ -95.88329102370966, 29.552248793884623 ],[ -95.888322559339912, 29.55167222500237 ],[ -95.892815691972388, 29.551157061377207 ],[ -95.897736248978021, 29.550578763556558 ],[ -95.910399305959999, 29.549116867213961 ],[ -95.923855636410593, 29.547576437107175 ],[ -95.937298627214119, 29.546046220812695 ],[ -95.945273176362306, 29.54514221201439 ],[ -95.951137220130576, 29.544476059357219 ],[ -95.964236136938482, 29.543007002970786 ],[ -95.970188404070598, 29.542353888884303 ],[ -95.975688436918546, 29.541750285267089 ],[ -95.987234139258348, 29.540462888259988 ],[ -95.989329192556497, 29.540230695528845 ],[ -95.991688089357012, 29.539959187914096 ],[ -96.000130574944478, 29.538993683647849 ],[ -96.014157906295239, 29.537433042387075 ],[ -96.027336767808151, 29.535959535239698 ],[ -96.041364054438176, 29.534396055545262 ],[ -96.048154640748862, 29.533570949334194 ],[ -96.055404650675584, 29.532808847648162 ]]
},
"properties": {"name": "US90A"}
},
{ "type": "Feature",
"geometry":{
"type": "LineString",
"coordinates": [[ -95.443899579354223, 29.596551757594483 ],[ -95.450711550556974, 29.596484410458228 ],[ -95.45277832877342, 29.596462723335119 ],[ -95.45356724676536, 29.596499811907325 ],[ -95.454353644075795, 29.596564170654567 ],[ -95.455136735454545, 29.596655778795721 ],[ -95.45591495406353, 29.59677442440762 ],[ -95.456686734752026, 29.596919892830492 ],[ -95.457381279038472, 29.59709116724034 ],[ -95.458067954181161, 29.597285101420141 ],[ -95.458745995832203, 29.597501158248217 ],[ -95.459414622832455, 29.597739145305841 ],[ -95.460072268112356, 29.597998849392376 ],[ -95.460718162351412, 29.598279734717035 ],[ -95.461351533466939, 29.598581437290846 ],[ -95.463276789092376, 29.599511264356774 ],[ -95.464685045741405, 29.600188541465812 ],[ -95.46854040288855, 29.601866776479294 ],[ -95.473923714541257, 29.604273032904768 ],[ -95.476934942436216, 29.605718447810595 ],[ -95.480400133276476, 29.607309524771566 ],[ -95.483843080659824, 29.608909555267655 ],[ -95.486513278910948, 29.610116556280001 ],[ -95.489106794010056, 29.611312031891693 ],[ -95.493886416648991, 29.613552388324642 ],[ -95.495670092148671, 29.61438838323145 ],[ -95.496562499795544, 29.6148320294066 ],[ -95.500388952514228, 29.617062606614923 ],[ -95.501303319592438, 29.617555805086603 ],[ -95.502232662657988, 29.618025656379043 ],[ -95.503177768799176, 29.618472184994413 ],[ -95.504137084846761, 29.618894830235377 ],[ -95.505109046665112, 29.619293208653353 ],[ -95.506094454690611, 29.619666998584208 ],[ -95.510863881626875, 29.621520540100246 ],[ -95.511482803464602, 29.62179255826964 ],[ -95.512088445235847, 29.622084688405721 ],[ -95.512681608069855, 29.622396612064549 ],[ -95.513260731305806, 29.622727768933142 ],[ -95.513825827437429, 29.623077987650749 ],[ -95.514374555254321, 29.623446522783393 ],[ -95.514906935766419, 29.623832856677883 ],[ -95.516322721289569, 29.624977836241506 ],[ -95.518154168081537, 29.62651674184098 ],[ -95.520811518798681, 29.628749287154772 ],[ -95.524148403078357, 29.631583919128758 ],[ -95.537081997353297, 29.642482136629464 ]]
},
"properties": {"name": "beltway8"}
}]};
Using this example as a guide, I was able to put GeoJSON data in a local file, and load it.
The html file:
<!DOCTYPE html>
<html style="height:100%;margin:0;padding:0">
<body style="height:90%;margin:10;padding:0">
<h1>Google Maps</h1>
<div id="gmap" style="width:100%;height:80%;"></div>
<script>
var coordinates;
function showMap() {
var script = document.createElement("script");
script.src = "my_geojson.js";
document.getElementsByTagName("head")[0].appendChild(script);
}
window.geojson_callback = function(results) {
console.log(results.geometry.coordinates);
coordinates = results.geometry.coordinates;
var centerCoord = new google.maps.LatLng(coordinates[0], coordinates[1]);
var mapCanvas = document.getElementById("gmap");
var mapOptions = {center: centerCoord, zoom: 8};
var map = new google.maps.Map(mapCanvas, mapOptions);
var marker = new google.maps.Marker({position:centerCoord});
marker.setMap(map);
}
</script>
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=showMap"></script>
</body>
</html>
The my_geojson.js file:
geojson_callback({
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [44.6294281206632,-123.060811758041]
},
"properties": {
"name": "In London"
}
});
Notes:
Tested on Firefox 51.0.1 and Opera 42.0.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With