Question

我试图通过尝试将Vega与Kibana集成的方式来了解其运作方式。（使用6.3）。

首先，我想通过在地图上显示简单的地理位置来了解事物的工作方式。我的最终目标是能够绘制形状和几何点。

我正在使用Kibana提供的构建Vega图形工具。

数据的外观

{
  "_index": "myindex",
  "_type": "mytype",
  "_id": "some_data_id",
  "_version": 1,
  "_score": null,
  "_source": {
    // other fields ...
    "location": {
      "geoPosition": {
        "lon": -120.40713879154383,
        "lat": 34.930076722390865
      },
      "country": "country_name",
      "geoArea": {
        "type": "Polygon",
        "coordinates": [
          [
            [
              -120.4093517762316,
              34.92910658338185
            ],
            [
              -120.4049810371925,
              34.92909830256884
            ],
            [
              -120.4049258068561,
              34.93102254256107
            ],
            [
              -120.40934245466,
              34.9310551422129
            ],
            [
              -120.4093517762316,
              34.92910658338185
            ]
          ]
        ]
      }
    }
    // other fields ...
  }
}

我可悲的尝试

{
  "$schema": "https://vega.github.io/schema/vega/v3.0.json"
  "config": {
    "kibana": { "type": "map", "delayRepaint": false }
  }
  "data": [ 
    {
      "name": "points"
      "url": {
        "index": "myindex"
        "body": {
          "_source": ["location"]
          "query": {
            "match_all": {}
          }
        }
      }
      "format": { "type": "json", "property": "hits.hits" }
    }
  ]
  "transform": {
    "type": "geopoint"
    "fields": ["geoPosition.lat", "geoPosition.lon"]
  }
  "marks": [
    {
      "type": "symbol"
      "from": { data: "points" }
      "encode": {
        "update":{
          "x": { "field": "x" }
          "y": { "field": "y" }
        }
      }
    }
  ]
}

当前结果

列表项
地图正确显示
似乎可以显示点，但是我猜在（0，0）-看左上角，蓝色点应该是地理点

我的其他问题

我不确定如何为此正确使用Vega调试。我看过VEGA_DEBUG.view.getState()，VEGA_DEBUG.view._runtime和VEGA_DEBUG.view.data('points')，但我无法正确理解数据流。在哪里可以看到转换输出以验证其“清晰”？基本上，这个问题可以是how would you have debugged this simple issue

Answer 1

哇，这是个老问题了……Vega / Elastic超级不受支持，因此很遗憾没人能早点解决这个问题。

您缺少的步骤是将纬度/经度转换为Vega可用于地图的（x，y）坐标的步骤。

本节：

"transform": {
    "type": "geopoint"
    "fields": ["geoPosition.lat", "geoPosition.lon"]
}

应该是这样的：

transform: [
    {
      from: points              // The name of your data object
      type: geopoint
      projection: projection
      fields: ["geoPosition.lat", "geoPosition.lon"]
    }
    {
      type: "formula", expr: "[datum.x, datum.y]", as: "center"
    }
    {
      type: "formula", expr: "{x:datum.center[0], y:datum.center[1]}", as: "centerDict"
    }
]

这将为您提供一个CenterDict对象，该对象表示Vega将正确映射的[x，y]对象。它还将添加分别代表x和y值的point.x和point.y。

一旦有了您就可以做到

"marks": [
    {
      "type": "symbol"
      "from": { data: "points" }
      "encode": {
        "update":{
          "x": "datum.x"
          "y": "datum.y"
        }
      }
    }
  ]

我尚未使用您的数据对此进行测试，但是我有类似的东西，因此它应该起作用。

祝你好运！

Vega中的Vega简单地理位置

1 个答案: