将一个LocalSearch工具添加到Leaflet JS库

时间:2012-06-11 13:10:06

标签: javascript leaflet

我正在尝试将一个本地搜索工具添加到Leaflet JS库中,我以前从未使用它,所以不太确定如何去做。我已经复制了缩放控件的工作方式,所以我添加了这个额外的功能:

L.Control.LocalSearch = L.Class.extend({
onAdd: function (a) {
    this._map = a,
    this._container = L.DomUtil.create("div", "leaflet-control-zoom"),
    this._localSearch = this._createSearch(leafletmapsmarker_L10n.search_form, "leaflet-control-zoom-in", this._map.zoomIn, this._map),
    this._container.appendChild(this._localSearch)
},
getContainer: function () {
    return this._container
},
getPosition: function () {
    return L.Control.Position.BOTTOM_LEFT
},
_createSearch: function (a, b, c, d) {
    var e = document.createElement("a");
    return e.href = "#", 
    e.title = a,
    e.className = b,
    L.Browser.touch || L.DomEvent.disableClickPropagation(e),
    L.DomEvent.addListener(e, "click", L.DomEvent.preventDefault),
    L.DomEvent.addListener(e, "click", c, d),
    e
}

然后开始这样:

    _initControls: function () {
    this.options.searchControl && this.addControl(new L.Control.LocalSearch), this.options.zoomControl && this.addControl(new L.Control.Zoom), this.options.attributionControl && (this.attributionControl = new L.Control.Attribution, this.addControl(this.attributionControl))
},

所以基本上我需要弄清楚如何添加搜索功能。也许我会以错误的方式解决这个问题,但我无法在网上找到关于此的更多信息,所以有人可以帮我解决这个问题吗?

1 个答案:

答案 0 :(得分:0)

试试这个新的传单插件: leaflet-search

这里可以尝试更多演示:

labs.easyblog.it/maps/leaflet-search/