map-search-vue

Maptalks search components for Vue 2.x

Get Start

Installation

npm install map-search-vue --save

yarn add map-search-vue

Initialization

import Vue from 'vue'
import MapSearchVue from 'map-search-vue'

Vue.use(MapSearchVue)

Usage

<template>
  <map-search-vue tk="YOUR_TK_KEY"></map-search-vue>
</template>

Quick Examples

Map with center marker

<map-search-vue tk="YOUR_TK_KEY" :center=[110,32]></map-search-vue>

Auto GeoCode

<map-search-vue tk="YOUR_TK_KEY" :autoGeoCode="true"></map-search-vue>

Method

<map-search-vue tk="YOUR_TK_KEY" ref="map" @map-info="whenChange" ></map-search-vue>

vm.$refs.map.search("txt");
vm.$refs.map.suggest("txt");
vm.$refs.map.geocode({x:112,y:32});

Events

| Event Name | Description | Parameters | | ---------- | ------------------------------------ | ------------------------------------- | | map-info | triggers when search,suggest,geocode | one parameters:{type,coordinate,data} |

props

| Attribute | Type | Description | Default | | -------------- | ------- | ------------------------- | --------------------------------------- | | center | Array | initial center of the map | [114.316200103,30.5810841269] | | searchExtent | Array | Search Range | [110.58838,29.25286,118.09204,31.98012] | | https | Boolean | http or https | true | | markerInCenter | Boolean | auto center map | true | | autoGeoCode | Boolean | geocode when map change | false | | timeout | Number | http request timeout | 6000 | | tk | String | tianditu key | "" |