добавить слой geojson-файла в карту google

Question

У меня есть следующий файл geojson, как я могу добавить его в goole map для представления слоя.

{"type":"FeatureCollection","features":[{"id":1111891,"osm_type":"relation","type":"Feature","name":"sahab","properties":{"name":"Sahab","stroke":"#555555","stroke-width":2,"stroke-opacity":1,"fill":"#555555","fill-opacity":0.3}, 
    "geometry":{"type":"MultiPolygon", 
    "coordinates":[[[[35.988016,31.873645],[35.992393,31.881444],[35.994281,31.880788],[35.994796,31.880205] 
    ,[35.995526,31.880824],[35.999378,31.883931],[36.001094,31.8805097],[36.001996,31.884987],[36.005214,31.883639],[36.006716,31.882838],[36.008004,31.882072],[36.009634,31.881161],[36.011222,31.880432],[36.012553,31.879849], 
    [36.015171,31.878027],[36.017273,31.876861],[36.018475,31.876351],[36.020363,31.875549],[36.022466,31.875258],[36.023454,31.875039],[36.023153,31.873727], 
    [36.022767,31.872962],[36.022767,31.870629],[36.024655,31.866256],[36.025771,31.860971],[36.025127,31.85227],[36.024612,31.849215],[36.024011,31.846444],[36.023839,31.843892],[36.023067,31.842434],[36.022724,31.840830], 
    [36.021350,31.839372],[36.021779,31.837913],[36.022380,31.837038],[36.023668,31.835288],[36.023410,31.833101],[36.023668,31.832663],[36.020835,31.834486],[36.008476,31.842945],[36.001180,31.846153],[35.999378,31.846590], 
    [35.997489,31.844694],[35.997060,31.843965],[35.995601,31.844913],[35.995429,31.846882],[35.996116,31.848632],[35.994056,31.851329],[35.994056,31.851329],[35.990451,31.851548],[35.990880,31.853079],[35.990108,31.859713],[35.988735,31.863722], 
    [35.987447,31.866055],[35.989078,31.868898],[35.986160,31.870429],[35.988016,31.873645]]]]}}]} 

Answer 1

См the documentation и the Google Maps Javascript API v3 reference

Вы можете загрузить его в виде файла из URL с помощью .loadGeoJson, или загрузить его как объект JSON с .addGeoJson:

map.data.addGeoJson({"type": "FeatureCollection","features": [{"id": 1111891,"osm_type": "relation","type": "Feature","name": "sahab","properties": {"name": "Sahab","stroke": "#555555","stroke-width": 2,"stroke-opacity": 1,"fill": "#555555","fill-opacity": 0.3},"geometry": {"type": "MultiPolygon","coordinates": [[[[35.988016, 31.873645],[35.992393, 31.881444],[35.994281, 31.880788],[35.994796, 31.880205],[35.995526, 31.880824],[35.999378, 31.883931],[36.001094, 31.8805097],[36.001996, 31.884987],[36.005214, 31.883639],[36.006716, 31.882838],[36.008004, 31.882072],[36.009634, 31.881161],[36.011222, 31.880432],[36.012553, 31.879849],[36.015171, 31.878027],[36.017273, 31.876861],[36.018475, 31.876351],[36.020363, 31.875549],[36.022466, 31.875258],[36.023454, 31.875039],[36.023153, 31.873727],[36.022767, 31.872962],[36.022767, 31.870629],[36.024655, 31.866256],[36.025771, 31.860971],[36.025127, 31.85227],[36.024612, 31.849215],[36.024011, 31.846444],[36.023839, 31.843892],[36.023067, 31.842434],[36.022724, 31.840830],[36.021350, 31.839372],[36.021779, 31.837913],[36.022380, 31.837038],[36.023668, 31.835288],[36.023410, 31.833101],[36.023668, 31.832663],[36.020835, 31.834486],[36.008476, 31.842945],[36.001180, 31.846153],[35.999378, 31.846590],[35.997489, 31.844694],[35.997060, 31.843965],[35.995601, 31.844913],[35.995429, 31.846882],[35.996116, 31.848632],[35.994056, 31.851329],[35.994056, 31.851329],[35.990451, 31.851548],[35.990880, 31.853079],[35.990108, 31.859713],[35.988735, 31.863722],[35.987447, 31.866055],[35.989078, 31.868898],[35.986160, 31.870429],[35.988016, 31.873645]]]]}}]}); 

фрагмент кода:

function initialize() { 
 
    var map = new google.maps.Map(
 
    document.getElementById("map_canvas"), { 
 
     center: new google.maps.LatLng(31.851329, 35.994056), 
 
     zoom: 12, 
 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
 
    }); 
 
    map.data.addGeoJson({ 
 
    "type": "FeatureCollection", 
 
    "features": [{ 
 
     "id": 1111891, 
 
     "osm_type": "relation", 
 
     "type": "Feature", 
 
     "name": "sahab", 
 
     "properties": { 
 
     "name": "Sahab", 
 
     "stroke": "#555555", 
 
     "stroke-width": 2, 
 
     "stroke-opacity": 1, 
 
     "fill": "#555555", 
 
     "fill-opacity": 0.3 
 
     }, 
 
     "geometry": { 
 
     "type": "MultiPolygon", 
 
     "coordinates": [ 
 
      [ 
 
      [ 
 
       [35.988016, 31.873645], 
 
       [35.992393, 31.881444], 
 
       [35.994281, 31.880788], 
 
       [35.994796, 31.880205], 
 
       [35.995526, 31.880824], 
 
       [35.999378, 31.883931], 
 
       [36.001094, 31.8805097], 
 
       [36.001996, 31.884987], 
 
       [36.005214, 31.883639], 
 
       [36.006716, 31.882838], 
 
       [36.008004, 31.882072], 
 
       [36.009634, 31.881161], 
 
       [36.011222, 31.880432], 
 
       [36.012553, 31.879849], 
 
       [36.015171, 31.878027], 
 
       [36.017273, 31.876861], 
 
       [36.018475, 31.876351], 
 
       [36.020363, 31.875549], 
 
       [36.022466, 31.875258], 
 
       [36.023454, 31.875039], 
 
       [36.023153, 31.873727], 
 
       [36.022767, 31.872962], 
 
       [36.022767, 31.870629], 
 
       [36.024655, 31.866256], 
 
       [36.025771, 31.860971], 
 
       [36.025127, 31.85227], 
 
       [36.024612, 31.849215], 
 
       [36.024011, 31.846444], 
 
       [36.023839, 31.843892], 
 
       [36.023067, 31.842434], 
 
       [36.022724, 31.840830], 
 
       [36.021350, 31.839372], 
 
       [36.021779, 31.837913], 
 
       [36.022380, 31.837038], 
 
       [36.023668, 31.835288], 
 
       [36.023410, 31.833101], 
 
       [36.023668, 31.832663], 
 
       [36.020835, 31.834486], 
 
       [36.008476, 31.842945], 
 
       [36.001180, 31.846153], 
 
       [35.999378, 31.846590], 
 
       [35.997489, 31.844694], 
 
       [35.997060, 31.843965], 
 
       [35.995601, 31.844913], 
 
       [35.995429, 31.846882], 
 
       [35.996116, 31.848632], 
 
       [35.994056, 31.851329], 
 
       [35.994056, 31.851329], 
 
       [35.990451, 31.851548], 
 
       [35.990880, 31.853079], 
 
       [35.990108, 31.859713], 
 
       [35.988735, 31.863722], 
 
       [35.987447, 31.866055], 
 
       [35.989078, 31.868898], 
 
       [35.986160, 31.870429], 
 
       [35.988016, 31.873645] 
 
      ] 
 
      ] 
 
     ] 
 
     } 
 
    }] 
 
    }); 
 

 
} 
 
google.maps.event.addDomListener(window, "load", initialize);

html, 
 
body, 
 
#map_canvas { 
 
    height: 100%; 
 
    width: 100%; 
 
    margin: 0px; 
 
    padding: 0px 
 
}

<script src="https://maps.googleapis.com/maps/api/js"></script> 
 
<div id="map_canvas"></div>