vue2-google-maps를 사용하여 폴리라인 생성

vue2-google-maps를 사용하여 폴리라인 생성

vue2-google-maps를 사용하여 한 국가에서 다른 국가로 경로를 설정했는데 추적할 수 있는 선이 필요합니다.구체적으로 말하면 점선입니다.여기 제 코드가 있습니다.

<gmap-map
:center="center"
:zoom="7"
style="width: 500px; height: 300px">
<gmap-marker
  v-for="m in markers"
  :position="m.position"
  :clickable="true"
  :draggable="true"
  @click="center=m.position"
></gmap-marker>

export default {
data () {
  return {
    center: {lat: 10.0, lng: 10.0},
    markers: [{
      position: {lat: 14.5995, lng: 120.9842},
      position: {lat: 14.2440, lng: 120.4278},
      position: {lat: 16.2325, lng: 119.3264}
    }, {
      position: {lat: 22.3964, lng: 114.1095}
    }]
  }
 }
}

다음과 같은 작업을 수행해야 합니다.

      <gmap-map v-bind:center="center" v-bind:zoom="12" style="width: 800px; height:500px" >
        <gmap-polyline v-bind:path.sync="path" v-bind:options="{ strokeColor:'#008000'}">
         </gmap-polyline>
      </gmap-map


export default {
    data () {
      return { 
        center: {lat: 55.915655, lng: -4.744502},
          path: [
            {lat: 55.9352001, lng: -4.7766924 },
            {lat: 55.9358131, lng: -4.7770143 },
            {lat: 55.9361256, lng: -4.7767353 },
            {lat: 55.9366784, lng: -4.7739458 }
]
            }
        }
      }

언급URL : https://stackoverflow.com/questions/43600392/create-polylines-using-vue2-google-maps