Как правильно расположить карту, чтобы правильно задать полилинии? - PullRequest
Новая
       30

Как правильно расположить карту, чтобы правильно задать полилинии?

0 голосов
/ 02 июня 2018

Я на самом деле показываю маршрутизацию в разные регионы, используя карты GoogleОднако для некоторых регионов полилиния не отображается должным образом.Он отображается следующим образом:

enter image description here

Я хочу показать прямую линию от Палембанга до Отани, но вместо этого он принимает кривую, которая тоже в двух разных сторонахкарты.Могу ли я узнать, как правильно расположить карту, чтобы линия была прямой, а не изогнутой, а также на одной карте.

Ниже мой код 

getLatLngOfAddress(data){

    var geocoder = new google.maps.Geocoder();let latitude;let longitude;var startPoint; var endPoint;
    var marker; var startCoordinates = []; var endCoordinates = []; var flightPlanCoordinates = [];

    var map = new google.maps.Map(document.getElementById('map'), {
        zoom: 2,
        center: new google.maps.LatLng(40.4637, 3.7492),
        mapTypeId: google.maps.MapTypeId.ROADMAP
    });

    var infowindow = new google.maps.InfoWindow();

    map.markers = [];

    var lineSymbol = {
      path: 'M 0,-1 0,1',
      strokeOpacity: 0.5,
      scale: 4
    };

    for(var i=0; i<data.length;i++){
        let port_of_loading = data[i].port_of_loading;
        let port_of_discharge = data[i].port_of_discharge
        geocoder.geocode( { 'address': port_of_loading}, function(results, status) {
            if (status == google.maps.GeocoderStatus.OK) {
                latitude = results[0].geometry.location.lat();
                longitude = results[0].geometry.location.lng();
            } 
            startCoordinates.push({'lat': latitude, 'lng': longitude});
            flightPlanCoordinates.push({'lat': latitude, 'lng': longitude, 'port_of_loading':port_of_loading});
            startPoint = new google.maps.LatLng(latitude, longitude);
        }); 
        geocoder.geocode( { 'address': port_of_discharge}, function(results, status) {
            if (status == google.maps.GeocoderStatus.OK) {
                latitude = results[0].geometry.location.lat();
                longitude = results[0].geometry.location.lng();  
            } 
            endCoordinates.push({'lat': latitude, 'lng': longitude});
            flightPlanCoordinates.push({'lat': latitude, 'lng': longitude, 'port_of_discharge':port_of_discharge});
            endPoint = new google.maps.LatLng(latitude, longitude);

            for(var j=0; j<flightPlanCoordinates.length; j++){
                marker = new google.maps.Marker({
                    position: new google.maps.LatLng(flightPlanCoordinates[j].lat, flightPlanCoordinates[j].lng),
                    map: map,
                });                    
                google.maps.event.addListener(marker, 'click', (function(marker, i) {
                    return function() {
                        infowindow.setContent(
                            '<span *ngIf="port_of_loading" class="info_content" ><strong> Port of Loading: '+flightPlanCoordinates[i].port_of_loading+'</strong>',
                            '<span *ngIf="port_of_discharge" class="info_content" ><strong> Port of Discharge: '+flightPlanCoordinates[i].port_of_discharge+'</strong>'  
                        );
                        infowindow.open(map, marker);
                    }
                })(marker, i));
                var flightPath = new google.maps.Polyline({
                    path: [startPoint, endPoint],
                    geodesic: true,
                    strokeColor: '#FF0000',
                    strokeOpacity: 0,
                    icons: [{
                        icon: lineSymbol,
                        offset: '0',
                        repeat: '20px'
                    }],
                    strokeWeight: 2
                });
                flightPath.setMap(map);
            }

        });
    }
}

1 Ответ

0 голосов
/ 03 июня 2018

Удалите geodesic: true из ваших полилиний.

Вы должны прочитать больше здесь о понятиях сферической геометрии.

...