Google Map как векторная карта

Question

Я искал везде, где это, самое близкое, что я нашел, не очень удовлетворительно ( это), Есть ли способ заставить карты Google выглядеть и вести себя как http://jvectormap.com/? Действуя, я имею в виду парящие страны и т. Д., А под словом я имею в виду чистый внешний вид, который имеет векторная карта.

Answer 1

Как предлагается в моем комментарии, вы можете проверить, как оформить карту:

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

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

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

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

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

Редактировать 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() когда ты нуждаешься. Надеюсь это поможет!