# Vega: Cannot get dynamic data into strokeDash field **URL:** \ **Category:** Kibana\ **Tags:** vega\ **Created:** [January 8, 2021, 2:02pm UTC](https://discuss.elastic.co/t/vega-cannot-get-dynamic-data-into-strokedash-field/260551 "2021-01-08T14:02:49Z")\ **Posts on this page:** 7\ **Page:** 1
**Author:** ![ege](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/ege/32/80438_2.png) [@ege](https://discuss.elastic.co/u/ege)\ **Post date:** [January 8, 2021, 2:02pm UTC](https://discuss.elastic.co/t/vega-cannot-get-dynamic-data-into-strokedash-field/260551/1 "2021-01-08T14:02:49Z")
I am in the process of creating a sequence diagram using Vega viz. The following code is the approach I'm using. ``` { "$schema": "https://vega.github.io/schema/vega/v5.json", "description": "Sequence Diagram", "padding": 5, "data": [ { "name": "events", "values": [ { "label": "message 1", "label-position": 100, "start": 1, "end": 2, "arrow-head": "triangle-right", "triangle-offset": -2, "dash": [0,0], "group": 1 }, { "label": "message 2", "label-position": -150, "start": 2, "end": 1, "arrow-head": "triangle-left", "triangle-offset": 8, "dash": [8,8], "group": 2 } ] }, { "name": "objects", "values": [ {"name": "Object 1", "position": 1}, {"name": "Object 2", "position": 2} ] } ], "scales": [ { "name": "yscale", "type": "band", "range": [50, 200], "domain": {"data": "events", "field": "label"} }, { "name": "xscale", "type": "band", "range": [0, 500], "domain": {"data": "events", "fields": ["start", "end"]} }, { "name": "color", "type": "linear", "range": {"scheme": "set1"}, "domain": {"data": "events", "field": "group"} } ], "marks": [ { "type": "text", "from": {"data": "objects"}, "encode": { "enter": { "x": {"scale": "xscale", "field": "position", "offset": -30}, "y": {"value": -25}, "fill": {"value": "#000"}, "text": {"field": "name"}, "fontSize": {"value": 15}, "fontWeight": {"value": "bold"} } } }, { "type": "rect", "from": {"data": "objects"}, "encode": { "enter": { "x": {"scale": "xscale", "field": "position", "offset": -45}, "y": {"value": -45}, "width": {"value": 90}, "height": {"value": 30}, "stroke": {"value": "#000"} } } }, { "type": "rect", "from": {"data": "objects"}, "encode": { "enter": { "x": {"scale": "xscale", "field": "position"}, "y": {"value": -15}, "width": {"value": 5}, "height": {"value": 200}, "fill": {"value": "#999"} } } }, { "type": "text", "from": {"data": "events"}, "encode": { "enter": { "x": {"scale": "xscale", "field": "start"}, "y": {"scale": "yscale", "field": "label", "offset": -4}, "dx": {"field": "label-position"}, "fill": {"value": "#000"}, "text": {"field": "label"}, "fontSize": {"value": 13} } } }, { "type": "rect", "from": {"data": "events"}, "encode": { "enter": { "x": {"scale": "xscale", "field": "start"}, "x2": {"scale": "xscale", "field": "end"}, "y": {"scale": "yscale", "field": "label"}, "stroke": {"scale": "color", "field": "group"}, "strokeWidth": {"value": 2}, "strokeDash": {"field": "dash"} } } }, { "type": "symbol", "from": {"data": "events"}, "encode": { "enter": { "x": { "scale": "xscale", "field": "end", "offset": {"field": "triangle-offset"} }, "x2": {"scale": "xscale"}, "y": {"scale": "yscale", "field": "label"}, "height": {"value": 4}, "fill": {"scale": "color", "field": "group"}, "shape": {"field": "arrow-head"} } } } ] } ``` The following is the result of the above code. ![issue_image_1](https://us1.discourse-cdn.com/elastic/original/3X/6/4/64e5e3768880e7c60fb0a3f653c52371fda1d427.png) I wanted to make **message2** a dashed-line using dynamic values. I have used the **strokeDash** field as seen in the **3rd rect mark** in the above code. According to the documentation, the _strokeDash_ field needs to have an array of two values; stroke and space. Adding an array to the data-set in the Vega code works fine, as you can see from the above code (see **dash** field in the data-set). However, the problem arises when I try to transfer the same data to an index as I cannot find a way to add the **dash** field into the index. I tried adding the two values as separate fields; **stroke** & **space** , in the data-set of the above code and read it using _strokeDash_ field as follows. `"strokeDash": {"fields": ["stroke", "space"]}` It won't show any errors and apparently, it won't read the values at all as the diagram turns out to be like the following. ![issue_image](https://us1.discourse-cdn.com/elastic/original/3X/4/7/47c298ccfdd497b93ab66a5120ae541393585c3e.png) How can I make the **message2** a dashed-line using dynamic data which can also be added to an index? Any help would be appreciated. ---
**Author:** ![markov00](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/markov00/32/33316_2.png) [@markov00](https://discuss.elastic.co/u/markov00)\ **Post date:** [January 11, 2021, 11:40am UTC](https://discuss.elastic.co/t/vega-cannot-get-dynamic-data-into-strokedash-field/260551/2 "2021-01-11T11:40:25Z")
Hi, have you tried to add the `dash` field using a scripted field? [https://www.elastic.co/guide/en/kibana/current/scripted-fields.html](https://www.elastic.co/guide/en/kibana/current/scripted-fields.html) ---
**Author:** ![ege](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/ege/32/80438_2.png) [@ege](https://discuss.elastic.co/u/ege)\ **Post date:** [January 11, 2021, 12:01pm UTC](https://discuss.elastic.co/t/vega-cannot-get-dynamic-data-into-strokedash-field/260551/3 "2021-01-11T12:01:56Z")
Hi @markov00 , thank you so much for the reply. No, I did not try using scripted-fields. I will try that out too. ---
**Author:** ![aaron-nimocks](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/aaron-nimocks/32/73965_2.png) [@aaron-nimocks](https://discuss.elastic.co/u/aaron-nimocks)\ **Post date:** [January 11, 2021, 12:32pm UTC](https://discuss.elastic.co/t/vega-cannot-get-dynamic-data-into-strokedash-field/260551/4 "2021-01-11T12:32:25Z")
You might be able to use [Extent Transform](https://vega.github.io/vega/docs/transforms/extent/) to create this depending on that different variations you are expecting to use. `{"type": "extent", "field": "message1", "signal": "dash1"}` `{"type": "extent", "field": "message2", "signal": "dash2"}` If your incoming data from `message1` has a min of `0` and max `0` then it will create a signal with the value of `[0,0]` and then it can be used in `strokeDash`. ---
**Author:** ![ege](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/ege/32/80438_2.png) [@ege](https://discuss.elastic.co/u/ege)\ **Post date:** [January 11, 2021, 12:57pm UTC](https://discuss.elastic.co/t/vega-cannot-get-dynamic-data-into-strokedash-field/260551/5 "2021-01-11T12:57:08Z")
Hi again @aaron-nimocks! Thank you for the reply. I will try Extent Transform too to check if it is possible to achieve it. ---
**Author:** ![ege](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/ege/32/80438_2.png) [@ege](https://discuss.elastic.co/u/ege)\ **Post date:** [January 11, 2021, 5:32pm UTC](https://discuss.elastic.co/t/vega-cannot-get-dynamic-data-into-strokedash-field/260551/6 "2021-01-11T17:32:43Z")
Adding scripted fields worked! Added it to a Painless script Vega code itself to create the array. Thank you so much @markov00! 😃 😍 I tried adding **Extent Transform** too as you said, @aaron-nimocks. The data which create the messages come from one index and according to what I understood about **Extent Transform** , I need to add it per message and it becomes a problem when all the data for messages comes from one index. But, thank you for the suggestion and I learnt something new from it too! 😊 ---
**Author:** ![system](https://us1.discourse-cdn.com/elastic/original/3X/1/a/1ac57faf039f6b580b3f104ef42a2a89e41014de.png) [@system](https://discuss.elastic.co/u/system)\ **Post date:** [February 8, 2021, 5:33pm UTC](https://discuss.elastic.co/t/vega-cannot-get-dynamic-data-into-strokedash-field/260551/7 "2021-02-08T17:33:32Z")
This topic was automatically closed 28 days after the last reply. New replies are no longer allowed.