# Vega-lite multi-view re-sizing issue in Kibana dashboard
**URL:** https://discuss.elastic.co/t/vega-lite-multi-view-re-sizing-issue-in-kibana-dashboard/208466
**Category:** Kibana
**Created:** [November 19, 2019, 9:23am UTC](https://discuss.elastic.co/t/vega-lite-multi-view-re-sizing-issue-in-kibana-dashboard/208466 "2019-11-19T09:23:13Z")
**Posts on this page:** 3
**Page:** 1
### Author:  [@Josip\_Cagalj](https://discuss.elastic.co/u/Josip_Cagalj)
#### Post date: [November 19, 2019, 9:23am UTC](https://discuss.elastic.co/t/vega-lite-multi-view-re-sizing-issue-in-kibana-dashboard/208466/1 "2019-11-19T09:23:14Z")
HI to everyone.
I have a problem with resizing my vega-lite visualization which is part of my dashboard. The visualization is not resizing according to its container.
My visualization is a multi-view composed of three bar charts being concatenated horizontally using `hconcat` keyword:
```
{
"$schema": "https://vega.github.io/schema/vega-lite/v2.json",
"data": {
"values": [
{"categ": "A", "In": 7752664.91, "Out": 7998880.02, "Diff": -246215.11},
{"categ": "B", "In": 1896544.08, "Out": 1961014.26, "Diff": -64470.18},
{"categ": "C", "In": 992074.65, "Out": 985438.38, "Diff": 6636.27},
{"categ": "D", "In": 741681.84, "Out": 708572.92, "Diff": 33108.92},
{"categ": "E", "In":776910.05, "Out": 694022.87, "Diff": 82887.18}
]
},
"transform": [
{ "calculate": "abs(datum.Diff)", "as": "Diff-Abs" }
],
"config": {
"view": {"stroke": "transparent" },
"bar": { "fillOpacity": 0.8},
"axis": { "labelFontSize":14},
"title": { "fontSize": 18},
"text": {
"fontSize": 18,
"fontWeight": 500,
"align" : "center",
"dy": 5
}
},
"spacing": 40,
"hconcat":
[
{
"title":"In",
"encoding": {
"y": {
"field": "categ",
"type":"nominal",
"axis":{"title": "", "ticks": false, "labelPadding": 10}
}
},
"layer": [
{
"mark": { "type": "bar", "fill": "lightblue" },
"encoding": {
"x": {
"field": "In",
"type": "quantitative",
"axis": null
}
}
},
{
"mark": {"type": "text", "align": "center", "dy": 2},
"encoding": { "text": { "field": "In", "type": "nominal"}}
}
]
},
{
"title":"Out",
"encoding": {
"y": {
"field": "categ",
"type":"nominal",
"axis":{"title": "", "ticks": false, "labelPadding": 10}
}
},
"layer": [
{
"mark": { "type": "bar", "fill": "lightblue" },
"encoding": {
"x": {
"field": "Out",
"type": "quantitative",
"axis": null
}
}
},
{
"mark": {"type": "text", "align": "center", "dy": 2},
"encoding": { "text": { "field": "Out", "type": "nominal"}}
}
]
},
{
"title":"Diff",
"encoding": {
"y": {
"field": "categ",
"type":"nominal",
"axis":{"title": "", "ticks": false, "labelPadding": 10}
}
},
"layer": [
{
"mark": { "type": "bar", "fill": "lightgreen" },
"encoding": {
"x": {
"field": "Diff-Abs",
"type": "quantitative",
"axis": null
},
"color": { "condition": {"test": "Diff < 0", "value": "red" }}
}
},
{
"mark": {"type": "text", "align": "center", "dy": 2},
"encoding": { "text": { "field": "Diff", "type": "nominal"}}
}
]
}
]
}
```
If I, use just one bar chart (e.g. the first one ) as a single view visualization it resizer just fine ?! So it must be something with concatenating views!
EDIT:
I forgot to mention how I did find a similar thread [here](https://discuss.elastic.co/t/width-and-height-of-multi-view-displays-in-vega-lite-to-resize-automatically-in-dashboard/199046) but that thread was closed automatically without a solution provided. Also, I would like to tag @nyuriks because of his reputation in vega and vega-light visualization here on the forum 😉
---
### Author:  [@flash1293](https://discuss.elastic.co/u/flash1293)
#### Post date: [November 19, 2019, 10:35am UTC](https://discuss.elastic.co/t/vega-lite-multi-view-re-sizing-issue-in-kibana-dashboard/208466/2 "2019-11-19T10:35:39Z")
Vega in Kibana automatically uses the autosize "fit" option to scale the visualization according to the container.
However this does not work for concatenated views as described here: [Customizing Size | Vega-Lite](https://vega.github.io/vega-lite/docs/size.html#limitations)
> - The view must be either a [single](https://vega.github.io/vega-lite/docs/spec.html#single) view or a [layered](https://vega.github.io/vega-lite/docs/layer.html) view. Fit does not work with other kinds of composed views ( `facet` / `hconcat` / `vconcat` / `repeat` ).
I'm not aware of a workaround besides using multiple vega charts, but maybe Yuri knows more 🙂
---
### Author:  [@system](https://discuss.elastic.co/u/system)
#### Post date: [December 17, 2019, 10:35am UTC](https://discuss.elastic.co/t/vega-lite-multi-view-re-sizing-issue-in-kibana-dashboard/208466/3 "2019-12-17T10:35:52Z")
This topic was automatically closed 28 days after the last reply. New replies are no longer allowed.