# \[Vega Map\] How to get geoshapes from elasticsearch index coordinates

**URL:** <https://discuss.elastic.co/t/vega-map-how-to-get-geoshapes-from-elasticsearch-index-coordinates/285677>\
**Category:** Kibana\
**Tags:** vega, maps\
**Created:** [October 1, 2021, 11:49am UTC](https://discuss.elastic.co/t/vega-map-how-to-get-geoshapes-from-elasticsearch-index-coordinates/285677 "2021-10-01T11:49:42Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![lehti](https://avatars.discourse-cdn.com/v4/letter/l/cab0a1/32.png) [@lehti](https://discuss.elastic.co/u/lehti)\
**Post date:** [October 1, 2021, 11:49am UTC](https://discuss.elastic.co/t/vega-map-how-to-get-geoshapes-from-elasticsearch-index-coordinates/285677/1 "2021-10-01T11:49:42Z")

</div>

Hi!

I need to make a map using Vega-visualization. The coordinates come from an Elasticsearch index. I can load the index into Vega just fine. The issue is that I have no idea how to get Vega to understand the coordinates as anything, especially as geoshapes. My index is of the form:

```auto
{
  "took" : 4,
  "timed_out" : false,
  "_shards" : {
    "total" : 1,
    "successful" : 1,
    "skipped" : 0,
    "failed" : 0
  },
  "hits" : {
    "total" : {
      "value" : 23,
      "relation" : "eq"
    },
    "max_score" : 1.0,
    "hits" : [
      {
        "_index" : "my_index",
        "_type" : "_doc",
        "_id" : "IjNdJnwBrZ33gI2pCUby",
        "_score" : 1.0,
        "_source" : {
          "coordinates" : {
            "type" : "polygon",
            "coordinates" : [
              [
                [
                  25.05822022737424,
                  60.27598832155146
                ],
	        …
                [
                  25.05822022737424,
                  60.27598832155146
                ]
              ]
            ]
          },
          "name" : "area1"
        }
      },
      {
        "_index" : "my_index",
        "_type" : "_doc",
        …

```

How to get the coordinates from the index and plot them as geoshapes? Thanks in advance!

---

<div class="post-metadata">

**Author:** ![Nathan\_Reese](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/nathan_reese/32/84829_2.png) [@Nathan\_Reese](https://discuss.elastic.co/u/Nathan_Reese)\
**Post date:** [October 5, 2021, 1:43am UTC](https://discuss.elastic.co/t/vega-map-how-to-get-geoshapes-from-elasticsearch-index-coordinates/285677/2 "2021-10-05T01:43:29Z")

</div>

What version of Kibana are you using? Have you tried displaying the geo\_shapes with [Maps](https://www.elastic.co/guide/en/kibana/current/maps.html)?

---

<div class="post-metadata">

**Author:** ![lehti](https://avatars.discourse-cdn.com/v4/letter/l/cab0a1/32.png) [@lehti](https://discuss.elastic.co/u/lehti)\
**Post date:** [October 5, 2021, 4:34am UTC](https://discuss.elastic.co/t/vega-map-how-to-get-geoshapes-from-elasticsearch-index-coordinates/285677/3 "2021-10-05T04:34:04Z")

</div>

I'm using 7.15.0, and the geoshapes work fine in Kibana's own maps.

---

<div class="post-metadata">

**Author:** ![Nathan\_Reese](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/nathan_reese/32/84829_2.png) [@Nathan\_Reese](https://discuss.elastic.co/u/Nathan_Reese)\
**Post date:** [October 6, 2021, 6:29pm UTC](https://discuss.elastic.co/t/vega-map-how-to-get-geoshapes-from-elasticsearch-index-coordinates/285677/4 "2021-10-06T18:29:40Z")

</div>

Looking at the docs for [vega geoshape transform](https://vega.github.io/vega/docs/transforms/geoshape/), it looks like it is not possible to use the native response from Elasticsearch. Elasticsearch does not return geojson, but rather returns custom json with embedded geojson geometries. Vega geoshape transform requires geojson.

What is missing is a way to wrap \_source.coordinates from a geometry like below.

```auto
{
            "type" : "polygon",
            "coordinates" : [
              [
                [
                  25.05822022737424,
                  60.27598832155146
                ],
	        …
                [
                  25.05822022737424,
                  60.27598832155146
                ]
              ]
            ]
          }

```

into a feature like the below.

```auto
{
  "type": "Feature",
  "geometry": {
            "type" : "polygon",
            "coordinates" : [
              [
                [
                  25.05822022737424,
                  60.27598832155146
                ],
	        …
                [
                  25.05822022737424,
                  60.27598832155146
                ]
              ]
            ]
          }
       }
   }

```

If you can figure out a way to modify the results in vega then you should be able to use geoshape transform.

Below is the vega configuration that I am using. I created an index of world countries from [https://vector.maps.elastic.co/files/world\_countries\_v7.geo.json](https://vector.maps.elastic.co/files/world_countries_v7.geo.json)

```auto
{
  $schema: https://vega.github.io/schema/vega/v5.json
  config: {
    kibana: {type: "map", latitude: 30, longitude: -120, zoom: 3}
  }
  data: [
    {
      name: world_countries
      url: {
        index: world_countries_v7
        %context%: true
        body: {
          size: 250
        }
      }
      format: {property: "hits.hits"}
    }
  ]
  scales: []
  marks: [
    {
      type: shape
      from: {data: "world_countries"}
      encode: {
        enter: {
          "strokeWidth": {"value": 0.5},
          "stroke": {"value": "#bbb"},
          "fill": {"value": "#000"},
          "zindex": {"value": 0}
        }
      },
      transform: [
        { 
          type: "geoshape", 
          projection: "projection",
          field: "_source.coordinates"
        }
      ]
    }
  ]
}

```

---

<div class="post-metadata">

**Author:** ![lehti](https://avatars.discourse-cdn.com/v4/letter/l/cab0a1/32.png) [@lehti](https://discuss.elastic.co/u/lehti)\
**Post date:** [October 7, 2021, 8:19am UTC](https://discuss.elastic.co/t/vega-map-how-to-get-geoshapes-from-elasticsearch-index-coordinates/285677/5 "2021-10-07T08:19:28Z")

</div>

Thanks for the tip! Do you know if it is possible to wrap Elasticsearch results in another schema (in this case, ""type": "Feature","geometry": ")? If not, should this be done by string concat + parsing to json?

---

<div class="post-metadata">

**Author:** ![lehti](https://avatars.discourse-cdn.com/v4/letter/l/cab0a1/32.png) [@lehti](https://discuss.elastic.co/u/lehti)\
**Post date:** [October 7, 2021, 2:10pm UTC](https://discuss.elastic.co/t/vega-map-how-to-get-geoshapes-from-elasticsearch-index-coordinates/285677/6 "2021-10-07T14:10:31Z")

</div>

A bit of an update: I've now managed to get the coordinates into the desired form. However, the shapes just don't appear. My current code:

```auto
{
  "$schema": "https://vega.github.io/schema/vega-lite/v4.16.8.json",
  "data": {
    "url": {"index": "my_index"},
    "format": {property: "hits.hits", "type": "json"},
  },
  "transform": [{
    "calculate": "merge({'type': 'Feature'}, {'geometry': datum._source.coordinates})",
    "as": "coordinates"
  },
  {
    "type": "geojson",
    "field": "coordinates"
  }],
  mark: "geoshape",
  encoding: {shape: {field: "coordinates"}}
}

```

So, what am I missing here?

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/elastic/original/3X/1/a/1ac57faf039f6b580b3f104ef42a2a89e41014de.png) [@system](https://discuss.elastic.co/u/system)\
**Post date:** [November 4, 2021, 2:10pm UTC](https://discuss.elastic.co/t/vega-map-how-to-get-geoshapes-from-elasticsearch-index-coordinates/285677/7 "2021-11-04T14:10:58Z")

</div>

This topic was automatically closed 28 days after the last reply. New replies are no longer allowed.