使用ko.computed和kendoMap綁定動態添加標記到kendoMap

我正在編寫什麼是有效的辦公室定位器。作爲這個的一部分，我想在初始位置的特定半徑內添加標記並將其放置在kendo地圖控件上。使用ko.computed和kendoMap綁定動態添加標記到kendoMap

的的jsfiddle是這裏http://jsfiddle.net/3whk8mm2/

我有低於該函數濾波器使用半正矢距離計算的officeLocations陣列。

self.filteredOffices = ko.computed(function() { 
     if(self.searchRadius() > 0) 
     { 
      var result = ko.utils.arrayFilter(self.officeLocations(), self.filter); 
      return result; 
     } 
    });

和地圖本身使用下列選項創建： -

self.mapOptions = { 
     center: [53.4809500, -2.2374300], 
     zoom: 5, 
     layers: [ 
      { 
       type: "tile", 
       urlTemplate: "http://#= subdomain #.tile.openstreetmap.org/#= zoom #/#= x #/#= y #.png", 
       subdomains: ["a", "b", "c"], 
       attribution: "&copy; <a href='http://osm.org/copyright'>OpenStreetMap contributors</a>" 
      }, { 
       type: "marker", 
       dataSource: self.filteredOffices, //works if put self.officeLocations() directly 
       locationField: "address.location", 
       titleField: "name" 
      }], 
    }

我知道filteredOffices收集得到正確填充作爲存在包含正確的結果在地圖上面的一個div。

我不能解決的是過濾後的辦公室爲什麼不顯示在地圖上？

任何幫助將是非常讚賞

來源

2015-10-07 lostinwpf

標記不更新，因爲dataSource選項不能被綁定到可觀察的。由於文檔says observables只能與center，zoom和widget選項一起使用。

要更新您的地圖，你可以訂閱self.filteredOffices變化：

self.filteredOffices.subscribe(function(value) { 
    $('.map').data('kendoMap').layers[1].dataSource.data(value); 
})

Fiddle

來源

2015-10-07 11:58:06 Valyok26

使用ko.computed和kendoMap綁定動態添加標記到kendoMap

回答

相關問題