Data section in vega visualization - from example to working with elastic

[shiranbi07]

I copied the heatmap example from vega (not vega lite) to kibana vega visualization. So far so good (after updating the url to full path)
I downloaded the data csv and loaded it as an index.
Now I want to be able to update the example so it will read all of the values without aggregation.

I tried the following:
"data": [
{
"name": "temperature",
url: {
index: temps
"%context%": true,
body: {
// Set the size to load 10000 documents
size: 10000,
// Just ask for the fields we actually need for visualization
_source: ["date", "temp"]
}
},
format: {property: "hits.hits"}
"transform": [
{"type": "formula", "as": "hour", "expr": "hours(datum.date)"},
{ "type": "formula", "as": "day",
"expr": "datetime(year(datum.date), month(datum.date), date(datum.date))"}
]
}
],

where url and format are my changes (my index name is "temps").
I don't think it reads the data properly
The error that i get is:

• Failed to execute 'addColorStop' on 'CanvasGradient': The provided float value is non-finite.
• Failed to execute 'addColorStop' on 'CanvasGradient': The provided float value is non-finite.

What do need to update for it to work?
What do i need to read to properly understand how this works?
thanks

[shiranbi07]

I figured it out,
here is the answer in case anyone else needs this

{
"$schema": "https://vega.github.io/schema/vega/v3.3.0.json",
"title": "Event counts from all indexes",
"data": {
"name": "temperature"
"url": {
"%context%": true,
"index": "temps", // name of index that i gave the data during import
"body": {"_source": ["date", "temp"], "size": 10000}
},
"format": {"property": "hits.hits"}
"transform": [
{"type": "formula", "as": "hour", "expr": "hours(datum._source.date)"},
{ "type": "formula", "as": "day",
"expr": "datetime(year(datum._source.date), month(datum._source.date), date(datum._source.date))"}
]
},

"signals": [
{
"name": "palette", "value": "Viridis",
"bind": {
"input": "select",
"options": [
"Viridis",
"Magma",
"Inferno",
"Plasma",
"Blues",
"Greens",
"Greys",
"Purples",
"Reds",
"Oranges",
"BlueOrange",
"BrownBlueGreen",
"PurpleGreen",
"PinkYellowGreen",
"PurpleOrange",
"RedBlue",
"RedGrey",
"RedYellowBlue",
"RedYellowGreen",
"BlueGreen",
"BluePurple",
"GreenBlue",
"OrangeRed",
"PurpleBlueGreen",
"PurpleBlue",
"PurpleRed",
"RedPurple",
"YellowGreenBlue",
"YellowGreen",
"YellowOrangeBrown",
"YellowOrangeRed"
]
}
},
{
"name": "reverse", "value": false, "bind": {"input": "checkbox"}
}
],

"scales": [
{
"name": "x",
"type": "time",
"domain": {"data": "temperature", "field": "day"},
"range": "width"
},
{
"name": "y",
"type": "band",
"domain": [
6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23,
0, 1, 2, 3, 4, 5
],
"range": "height"
},
{
"name": "color",
"type": "sequential",
"range": {"scheme": {"signal": "palette"}},
"domain": {"data": "temperature", "field": "_source.temp"},
"reverse": {"signal": "reverse"},
"zero": false, "nice": true
}
],

"axes": [
{"orient": "bottom", "scale": "x", "domain": false, "title": "Month", "format": "%b"},
{
"orient": "left", "scale": "y", "domain": false, "title": "Hour",
"encode": {
"labels": {
"update": {
"text": {"signal": "datum.value === 0 ? 'Midnight' : datum.value === 12 ? 'Noon' : datum.value < 12 ? datum.value + ':00 am' : (datum.value - 12) + ':00 pm'"}
}
}
}
}
],

"legends": [
{
"fill": "color",
"type": "gradient",
"title": "Avg. Temp (°F)",
"titleFontSize": 12,
"titlePadding": 4,
"gradientLength": {"signal": "height - 16"}
}
],

"marks": [
{
"type": "rect",
"from": {"data": "temperature"},
"encode": {
"enter": {
"x": {"scale": "x", "field": "day"},
"y": {"scale": "y", "field": "hour"},
"width": {"value": 5},
"height": {"scale": "y", "band": 1},
"tooltip": {"signal": "timeFormat(datum.date, '%b %d %I:00 %p') + ': ' + datum._source.temp + '°'"}
},
"update": {
"fill": {"scale": "color", "field": "_source.temp"}
}
}
}
]
}