0

http://www.daftlogic.com/projects-google-maps-distance-calculator.htmにあるマップ関数の新しいバージョンを作成しようとしています が、v3apiを使用しています。

これまでのところ、クリック時にマーカーを設定でき、測地線ポリラインを描画できます。私が現在直面している問題は次のとおりです。

  • マーカードラッグでポリラインを更新する
  • 合計距離に追加されるポイントをクリックして追加し続けることができるように、各マーカーを配列に配置し、forループを実行する必要があると確信しています。
  • 距離を正しく表示します。

jsfiddleを作成しました：http： //jsfiddle.net/wyZyS/

編集：「更新」関数を呼び出すものが何もないことに気付きました。現在、各マーカーの配列を作成しようとしています。表示される計算は、メートルを海里に変換しています。

4

1 に答える 1

0

少し前に、練習としてこのようなことを書きました。悲しいことに、それは Chrome でのみ適切に動作し、他のブラウザには奇妙なバグがあります。距離関数は IE9 で動作するはずです。

私が考えていたのは、リスナーをマーカーに追加dragし、パスを表す単一のポリラインを保持し、マーカーがドラッグされるとそのパスを更新することでした。

デモ http://freezoo.alwaysdata.net/freezoomaps/freezoomaps.html

      google.maps.event.addListener(tmpNode, 'drag', function(event) {
        distance.drawPath();
      });


    distance.drawPath = function() {
      distance.countNodes();
      var coords = [];
      for (var i = 0; i < distance.nodes.length; i++) {
        coords.push(distance.nodes[i].getPosition());
      }
      distance.line.setPath(coords);

      meters = google.maps.geometry.spherical.computeLength(coords);
      $("#distance_km").val((meters/1000).toFixed(3));
      $("#distance_mi").val((meters/1609.344).toFixed(3));
    }

    distance.countNodes = function() {
      var count = 0;
      for (var i = distance.nodes.length - 1; i >= 0; i--) {
        if (distance.nodes[i].getMap() == null) {
          distance.nodes.splice(i, 1);
        }
        else {
          count++;
        }
      }
      return count;
    }

    distance.clearNodes = function() {
      for(var i = 0; i < distance.nodes.length; i++) {
        distance.nodes[i].setMap(null);
      }
      distance.drawPath();
    }
于 2012-09-22T21:36:15.713 に答える