Question

我目前正在使用Jekyll 3.30，我正在寻找一个商店定位器。我正在计划当前的功能。

转到定位器页面
邮政编码/邮政编码中的类型
选择里程数 - ＆gt; 20英里/ 40英里/ 60英里
列出最接近的商店的结果。

现在我的问题是，在使用Google地理编码服务时，如何存储要查询的位置的最佳方式？

是否可以将_data文件夹中的位置存储为JSON？

或者将位置存储在一个像contenful这样的地方然后通过ajax检索它们会更好吗？

编辑：

所以我已经能够将数据从数据文件中提取到json中并将其提供给谷歌地图并返回距离。但是如何将距离分配回原始项目？

//zipcode
var origin = '50539'

// list of locations
var destination = {{site.data.store | jsonify}}

//loop through and return the distance of each object
for (var i = 0; i < destination.length; i++ ){

var service = new google.maps.DistanceMatrixService();
service.getDistanceMatrix({origins: [origin],destinations: [destination[i].storeaddress],travelMode: 'DRIVING', unitSystem: google.maps.UnitSystem.IMPERIAL}, callback);

    function callback (response,status) {

    var distance = response.rows["0"].elements["0"].distance.text;
    var store = destination;
    console.log(distance + store[i].storename);

  }
}

Answer 1

任何可以提供网络资源的东西（你的json文件）都可以。

然而，在我看来，用jekyll服务会有两个好处：

它与您的网页具有相同的网址，因此，加载时没有跨域问题
数据与您的应用程序位于同一代码存储库中

为避免手动编写json，您可以将商店存储在_post中并使用液体模板生成json文件。

您的帖子在yaml标头中包含元数据，例如：

---
guid: "3f8bf46a9c21"
title: "Mont Lozère"
latlng: "44.425962, 3.739340"
youtubeId: "0OHCYmOMZmg" 
---

你的json模板看起来像（对不起，我的例子是jsonp，但你会得到这个想法）：

---
---
{% assign posts = site.posts | where:"type", "youtube" %}
/* Number of places: {{ posts | size }} */
processJSON([
  {% for post in posts %}
    {
      "guid": "{{ post.guid }}",
      "title": "{{ post.title }}",
      "latlng": "{{ post.latlng }}",
      "youtubeId": "{{ post.youtubeId }}"
    }
    {% unless forloop.last %},{% endunless %}
  {% endfor %}
]);

在此示例中，位置（您的商店）位于文件夹_post / youtube中，_config.yml提供了＆＃39;类型＆＃39; （从其他帖子单身）

defaults:
  - scope:
      path: "_posts/youtube"
    values:
      type: "youtube"

您可以从https://github.com/franceimage/franceimage.github.io

使用Jekyll构建商店定位器

1 个答案: