GoogleMap에서 목의 우동 ※ 좌표를 얻고 서랍 그림을 만들고 싶습니다.

※마키노우동 : 후쿠오카를 대표하는 우동가게. 인쇄도 있고 자신은 가장 맛있는 우동이라고 생각합니다.
양은 많다. 국수는 부드럽다.

이런 느낌입니다.

서랍 그림이란?

각 삼각형의 외접원이 다른 점을 내부에 포함하지 않는 삼각형 분할이며, 평면에서 최소 각 최대, 일반 차원에서도 최대 최소 포함 원 최소 등 최적화 기준을 만족한다. 같다.

자세한 내용은 위키피디아에서 확인하십시오.

정책

1. 검색 단어 ( "목의 우동")의 좌표를 가져옵니다.
2. 좌표에서 서랍 그림을 만듭니다.
3. 서랍 그림을 그립니다.

소스 코드

makinoDelaunay.js

var map;
function initMap() {
  map = new google.maps.Map(
    document.getElementById('map'),
    {center: {lat: 33.576653, lng: 130.412336}, //福岡らへん
    zoom: 12}
  );

  //牧のうどんの座標を取得
  getLatLng("牧のうどん");
}


//座標を取得し描画　参考：http://www.nanchatte.com/map/getLatLngByAddress.html
function getLatLng(place) {
  var pt = [];
  var vertex = []
  var geocoder = new google.maps.Geocoder();

  geocoder.geocode({
    address: place,
    region: 'jp'
  }, function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
      var bounds = new google.maps.LatLngBounds();
      for (var r in results) {
        if (results[r].geometry) {
          var latlng = results[r].geometry.location;
          bounds.extend(latlng);

          //マーカーを描画
          new google.maps.Marker({
            position: latlng,
            map: map
          });

          pt.push(latlng);
          vertex.push([results[r].geometry.location.lat(), results[r].geometry.location.lng()]);
        }
      }

      //ドロネー図を作成　参考：https://github.com/ironwallaby/delaunay
      var triangles = Delaunay.triangulate(vertex);

      //ドロネー図の描画
      var delaunayPath;
      for (var t in triangles){
        t =  parseInt(t);
        var pathArray = [];
        if(t%3==0 && t < triangles.length-2){
          pathArray.push(pt[triangles[t+2]]);
          pathArray.push(pt[triangles[t+1]]);
          pathArray.push(pt[triangles[t]]);
          pathArray.push(pt[triangles[t+2]]);

          delaunayPath = new google.maps.Polyline({
            path: pathArray,  //ポリラインの配列
            strokeColor: '#FF0000',       //色（#RRGGBB形式）
            strokeOpacity: 1.0,           //透明度 0.0～1.0（デフォルト）
            strokeWeight: 1                //太さ（単位ピクセル）
          });

          delaunayPath.setMap(map);
        }
      }
    }
  });
}

1. 좌표 획득

geocoder.geocode

에서 결과에 검색 결과를 저장합니다.
result에 대해서는 여기 에 상세가 있습니다.

위키피디아 과 점포수가 맞지 않네요.

2.드로네 다이어그램의 작성

var triangles = Delaunay.triangulate(vertex);

서랍 그림 작성 소스는 여기에서 빌려 왔습니다. 좌표의 배열을 입력하면, 패스를 돌려주는 블랙 박스입니다.

3. 도로네 다이어그램 그리기

    var delaunayPath;
      for (var t in triangles){
        t =  parseInt(t);
        var pathArray = [];
        if(t%3==0 && t < triangles.length-2){
          pathArray.push(pt[triangles[t+2]]);
          pathArray.push(pt[triangles[t+1]]);
          pathArray.push(pt[triangles[t]]);
          pathArray.push(pt[triangles[t+2]]);

          delaunayPath = new google.maps.Polyline({
            path: pathArray,  //ポリラインの配列
            strokeColor: '#FF0000',       //色（#RRGGBB形式）
            strokeOpacity: 1.0,           //透明度 0.0～1.0（デフォルト）
            strokeWeight: 1                //太さ（単位ピクセル）
          });

          delaunayPath.setMap(map);
        }
      }

triangles에서 세 점씩 꺼내 삼각형을 그립니다.

덤

자씨 우동도 만들어 보았습니다.
점포가 많은 쪽이 외형이 재미있고 좋네요.
우동은 마키 쪽이 맛있다고 생각합니다만.

참고

다음을 참고했습니다.

h tp // w w. 뭐야. 이 m/마 p/게 tぁ tL ㄱ g 삐 d d s s. HTML

htps : // 기주 b. 코 m / 여러가지 by /

h tp // w w. 오, ぇ- 마피. 이 m/오오gぇまps/포lyぃねーぢspぁy. HTML