# Vega Beeswarm

**URL:** <https://discuss.elastic.co/t/vega-beeswarm/256280>\
**Category:** Kibana\
**Tags:** vega\
**Created:** [November 22, 2020, 7:13pm UTC](https://discuss.elastic.co/t/vega-beeswarm/256280 "2020-11-22T19:13:37Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![GavinBeattie](https://avatars.discourse-cdn.com/v4/letter/g/5f9b8f/32.png) [@GavinBeattie](https://discuss.elastic.co/u/GavinBeattie)\
**Post date:** [November 22, 2020, 7:13pm UTC](https://discuss.elastic.co/t/vega-beeswarm/256280/1 "2020-11-22T19:13:37Z")

</div>

I am trying to use the Beeswarm chart in Vega visualisation, but I am unable to get data points to display. When I get to the  
_"marks": [_

- {\*
- 

```
 "name": "nodes",*

```

- 

```
 "data": "people.",*

```

element should this be the named data table or something else?

Has anyone managed to use the Beeswarm chart connected to index data?

---

<div class="post-metadata">

**Author:** ![afharo](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/afharo/32/75202_2.png) [@afharo](https://discuss.elastic.co/u/afharo)\
**Post date:** [November 23, 2020, 3:05pm UTC](https://discuss.elastic.co/t/vega-beeswarm/256280/2 "2020-11-23T15:05:46Z")

</div>

Hi @GavinBeattie,

~~At the moment, Kibana only supports Vega-lite visualizations. Apparently, Beeswarm is only available in the full version of `vega` ([https://github.com/vega/vega-lite/issues/3421](https://github.com/vega/vega-lite/issues/3421)). However, maybe you can still achieve something similar via the [Box Plot type](https://vega.github.io/vega-lite/docs/boxplot.html) in Vega-Lite?~~

UPDATE: Kibana DOES support Vega visualisations. Scratching out my comment.

---

<div class="post-metadata">

**Author:** ![GavinBeattie](https://avatars.discourse-cdn.com/v4/letter/g/5f9b8f/32.png) [@GavinBeattie](https://discuss.elastic.co/u/GavinBeattie)\
**Post date:** [November 23, 2020, 4:04pm UTC](https://discuss.elastic.co/t/vega-beeswarm/256280/3 "2020-11-23T16:04:15Z")

</div>

Hi @afhero,  
Thanks for reply, but I got it working.

The trick seems to be that the data needs a name element that can be picked up later on:  
// Define the data source  
data: {  
**name: "people"**  
url: {  
// Apply dashboard context filters when set  
%context%: true  
// Filter the time picker (upper right corner) with this field  
%timefield%: startDateTime

/\*  
See .search() documentation for : [https://www.elastic.co/guide/en/elasticsearch/client/javascript-api/current/api-reference.html#api-search](https://www.elastic.co/guide/en/elasticsearch/client/javascript-api/current/api-reference.html#api-search)  
\*/  
################################  
Then pick up the same name for other elements:  
"marks": [  
{  
"name": "nodes",  
"type": "symbol",  
"from": { **"data": "people"}** ,  
"encode": {  
"enter": {  
"fill": {"scale": "color", "field": "\_source.jobGrade"},  
"xfocus": {"scale": "xscale", "field": "\_source.relationshipStrength", "band": 0.5},  
"yfocus": {"scale": "yscale", "field": "\_source.potentialSupport", "band": 0.5}

It might be worth adding the name element to the built in visualisation template.

---

<div class="post-metadata">

**Author:** ![afharo](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/afharo/32/75202_2.png) [@afharo](https://discuss.elastic.co/u/afharo)\
**Post date:** [November 23, 2020, 4:16pm UTC](https://discuss.elastic.co/t/vega-beeswarm/256280/4 "2020-11-23T16:16:47Z")

</div>

Cool! Thank you for sharing your findings! I'm sure other folks will appreciate (I personally do) ❤

---

<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:** [December 21, 2020, 4:16pm UTC](https://discuss.elastic.co/t/vega-beeswarm/256280/5 "2020-12-21T16:16:50Z")

</div>

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