2014-01-23 3 views
7

Я искал все, где это было, ближайший я нашел не очень удовлетворительный (this), Есть ли все равно, чтобы получить карты Google, выглядящие и действующие как jvectormap? Действуя я имею в виду страны с зависанием и т. Д., И, глядя, я имею в виду чистый взгляд, который имеет vectormap.Google Map как векторная карта

+0

AFAIK нет простого способа достичь этого с помощью API Карт Google. Вы можете проверить https://developers.google.com/maps/documentation/javascript/styling, что позволяет вам стилизовать свою карту по своему усмотрению. Чтобы наложить границы стран, вы можете проверить таблицы Fusion. Вот пример набора данных: https://www.google.com/fusiontables/DataSource?docid=1OJYGQVi56l6tzYGfH5YvQ6m2-Nk76_w35iwDd7g. Если вам нужна дополнительная информация о том, как все это сделать, сообщите мне. – MrUpsidown

+0

Из моего опыта, наложение границ стран мира на карте может быть довольно ресурсоемким. Поэтому я настоятельно рекомендую вам импортировать данные таблицы Fusion в свою локальную базу данных и использовать ее оттуда. – MrUpsidown

+0

MrUpsidedown, пожалуйста, любая информация о том, как собрать все это вместе, была бы замечательной, она кажется твердым решением. –

ответ

12

Как было предложено в мой комментарий, вы можете проверить, как стиль карта:

https://developers.google.com/maps/documentation/javascript/styling

Это может помочь вам понять, как это работает, и в конечном итоге позволит вам создать свой собственный:

http://gmaps-samples-v3.googlecode.com/svn/trunk/styledmaps/wizard/index.html

Что касается Fusion Tables, как только вы найдете подходящий набор данных (их много, некоторые неполные, более или менее, а уровень геометрических деталей может варьироваться от одного набора к другому), вы можете загрузить его как CSV и импортировать его в свою БД. Оттуда вы можете запросить свою БД и создать полигоны для каждой страны. Я позже обновлю свой ответ с помощью некоторого кода, который поможет вам начать работу.

Редактировать: Вот набор данных, который я использовал для одного из моих проектов. Может быть, это может вам помочь. Он содержит только те поля, которые меня интересуют, но имеет случайные цвета, связанные с каждой страной. http://www.sendspace.com/file/plgku3 https://www.dropbox.com/s/7o5y26gfim1asf0/gmaps_countries.sql?dl=0

Edit 2: Вот JavaScript:

var g = google.maps; 
var countries = []; 

function jsonCountries() { 

    $.ajax({ 

     url : 'get_countries.php', 
     cache : true, 
     dataType : 'json', 
     async : true, 

     success : function(data) { 

      if (data) { 

       $.each(data, function(id,country) { 

        var countryCoords; 
        var ca; 
        var co; 

        if ('multi' in country) { 

         var ccArray = []; 

         for (var t in country['xml']['Polygon']) { 

          countryCoords = []; 

          co = country['xml']['Polygon'][t]['outerBoundaryIs']['LinearRing']['coordinates'].split(' '); 

          for (var i in co) { 

           ca = co[i].split(','); 

           countryCoords.push(new g.LatLng(ca[1], ca[0])); 
          } 

          ccArray.push(countryCoords); 
         } 

         createCountry(ccArray,country); 

        } else { 

         countryCoords = []; 

         co = country['xml']['outerBoundaryIs']['LinearRing']['coordinates'].split(' '); 

         for (var j in co) { 

          ca = co[j].split(','); 

          countryCoords.push(new g.LatLng(ca[1], ca[0])); 
         } 

         createCountry(countryCoords,country); 
        } 
       }); 

       toggleCountries(); 
      } 
     } 
    }); 
} 

function createCountry(coords, country) { 

    var currentCountry = new g.Polygon({ 
     paths: coords, 
     strokeColor: 'white', 
     strokeOpacity: 1, 
     strokeWeight: 1, 
     fillColor: country['color'], 
     fillOpacity: .6 
    }); 

    countries.push(currentCountry); 
} 

function toggleCountries() { 

    for (var i=0; i<countries.length; i++) { 

     if (countries[i].getMap() !== null) { 

      countries[i].setMap(null); 

     } else { 

      countries[i].setMap(map); 
     } 
    } 
} 

А вот get_countries.php:

$results = array(); 

$sql = "SELECT * from gmaps_countries"; 
$result = $db->query($sql) or die($db->error); 

while ($obj = $result->fetch_object()) { 

    $obj->xml = simplexml_load_string($obj->geometry); 
    $obj->geometry = ''; 

    foreach ($obj->xml->Polygon as $value) { 

     $obj->multi = 'multigeo'; 
    } 

    $results[] = $obj; 
} 

echo json_encode($results); 

Просто позвоните jsonCountries(), когда вам нужно , Надеюсь это поможет!

+0

попробует это, спасибо! –

+0

Обратите внимание, что некоторые страны имеют множество наборов геометрии, поэтому 'if ('multi' в стране), которые я установил с помощью PHP. – MrUpsidown

+0

Просто подсказка: если вы хотите, чтобы он выглядел как jvectormap, вы могли бы использовать стиль, чтобы в принципе скрыть все (кроме воды, возможно), а затем наложить на страны. Повеселись! – MrUpsidown

Смежные вопросы