OL Search - 一個 Openlayers API 快速訪問拓展

為什么

openlayers的API文檔內容是極好的，然而使用起來卻一言難盡。

一般的查api的方式有以下兩種：

• 搜索引擎 ?? openlayers + 關鍵字 ?? 打開指定鏈接
• 打開api doc頁面 ?? 搜索關鍵字 ?? 通過搜索結果到達指定結果

OL Search ^[1]

OL Search是一款瀏覽器拓展（目前只上架了Edge add-ons^[2]），可以通過瀏覽器地址欄快捷搜索openlayers api，步驟如下：

1. control+L 或者 cmd+L 進入搜索欄。
2. 輸入ol關鍵字，tab 或者 space 進入 OL Search。
3. 輸入目標api （方法、成員變量、觸發器等）的關鍵字，選擇指定鏈接直達。

實現

主要分三步：

解析api文檔

https://openlayers.org/en/latest/apidoc/navigation.tmpl.html

文檔的導航欄部分鑲嵌了一個HTML，來自上面的地址。
這里本來有兩個思路。
一是通過修改openlayers自己的 api build的腳本生成一組與上述HTML內容一致的JSON格式的api文檔信息。
但考慮到兩點：

• 后期維護問題，如果這么做，每個小版本更新需要重新更新插件。
  -插件體積變大。
  另一種是直接解析上面的HTML的導航信息文件，這里遇到了問題，因為在瀏覽器的插件中，backgroud.js里無法訪問DOMParser對象，這里走了彎路，最開始曲線救國，通過popup(點擊拓展圖標顯示的小彈窗)加載數據。這種方式缺點很明顯，用戶安裝完插件后無法直接使用，需要點擊拓展圖標等待索引文件初始化后才能使用。之后找到了一個純javascript的DOM解析庫，才解決了該問題。

模糊搜索

最開始的時候采用硬搜索，自己使用起來都不滿意，因為打字偶爾的typo不可避免，因此模糊搜索應該是剛需。
這里參考了mdn-search 的做法，引入了fuse.js 。也做了一些多關鍵字的增強。
比如在搜索readFeatures這個方法的時候，各種格式例如EsriJSON、KML、WKT等都有readFeatures方法，而默認搜索結果WKT在后面，假如我想找WKT的readFeatures的話就會影響體驗。
通過fuse.js的search.$or，實現了多關鍵字的復合搜索。
這樣只需要輸入readFeatures wkt 就可以將包含WKT的結果提到第一個候選。

干掉默認推薦

在監聽地址欄omnibox內容變化事件的回調函數中，瀏覽器默認會在你給的推薦結果前面默認加一條默認推薦，其內容是你鍵入的內容，指向的地址是你拓展的地址加上該內容。默認行為即File not found。
這部分思路來自rust-search-extension ，首先根據用戶的鍵入內容結合搜索結果，將默認推薦設置為原本的第二條結果（真正搜索結果的第一順位），之后在用戶回車后判斷該選項是否是默認建議，如果是，則指向真正搜索結果的第一順位的地址。

最后

希望該工具給重度使用openlayers api doc的各位同仁帶來幫助。