Kibana dashbord trading candle

[Adriann (Adrian)]

Hello,

giving this example data,
Is It possible to make trading candle in kibana? Maybe using timelion?

{'crypto.candle.close': '16746.10000000',
  'crypto.candle.closeTime': '2020-11-16T22:59:59Z',
  'crypto.candle.high': '16768.79000000',
  'crypto.candle.intervalName': '1MINUTE',
  'crypto.candle.low': '16650.00000000',
  'crypto.candle.name': 'BTCUSDT',
  'crypto.candle.numberOfTrades': 52927,
  'crypto.candle.open': '16695.41000000',
  'crypto.candle.openTime': '2020-11-16T22:00:00Z',
  'crypto.candle.quoteAssetVolume': '33524105.17010261',
  'crypto.candle.takerBuyBaseAssetVolume': '1006.47549000',
  'crypto.candle.takerBuyQuoteAssetVolume': '16822669.52254529',
  'crypto.candle.volume': '2005.95127300'}]

Candle example

[aaron-nimocks]

You can in Vega. But it will be 100% custom and nothing really out of the box.

[Adriann (Adrian)]

@aaron-nimocks
Hi thanks for your hint with VEGA.

Can you help me one more time with a hint what am I doing wrong?

{
  "$schema": "https://vega.github.io/schema/vega-lite/v4.json",
  "width": 800,
    "autosize": {
    "type": "fit",
    "contains": "padding"
  },
  "description": "A candlestick chart inspired by an example in Protovis (http://mbostock.github.io/protovis/ex/candlestick.html)",
  "data": {url: {
  // Specify the time filter.
  %timefield%: crypto.candle.openTime
  // Apply dashboard context filters when set
  %context%: true

  // Which indexes to search
  index: "crypto-*"
  // The body element may contain "aggs" and "query" keys
  body: {
    aggs: {
      time_buckets: {
        date_histogram: {
          // Use date histogram aggregation on @timestamp field
          field: "crypto.candle.openTime"
          // interval value will depend on the time filter
          // Use an integer to set approximate bucket count
          // interval: { %autointerval%: true }
          "interval": "1h"
          // Make sure we get an entire range, even if it has no data
          // extended_bounds: {
          //   min: { %timefilter%: "min" }
          //   max: { %timefilter%: "max" }
          // }
          // Use this for linear (e.g. line, area) graphs
          // Without it, empty buckets will not show up
          min_doc_count: 1
        }
      }
    }
    // Speed up the response by only including aggregation results
    size: 0
  }
}},
  "encoding": {
    "x": {
      "field": "key",
      "type": "temporal",
      "title": "Date",
      "axis": {
        "format": "%Y-%m-%dT%H:%M:%SZ",
        "labelAngle": -45,
        "title": "Date"
      }
    },
    "y": {
      "type": "quantitative",
      field: "doc_count",
      "scale": {"zero": false},
      "axis": {"title": "Price"}
    },
    "color": {
      "condition": {
        "test": "datum.open < datum.close",
        "value": "#06982d"
      },
      "value": "#ae1325"
    }
  },
  "layer": [
    {
      "mark": "rule",
      "encoding": {
        "y": {"field": "crypto.candle.low"},
        "y2": {"field": "crypto.candle.high"}
      }
    },
    {
      "mark": "bar",
      "encoding": {
        "y": {"field": "crypto.candle.open.max"},
        "y2": {"field": "crypto.candle.close.max"}
      }
    }
  ]
}

[aaron-nimocks]

Not sure I understand your data and query but if you want to start with the visualization first you can use the Vega Editor and hardcode the data.

I started it and did a basic design of what I think you are looking for. The hard part is doing the transformations/math to get the boxes in the right spot. Then you can conditionally color the boxes to be green or red.

Does this help at all?

[Adriann (Adrian)]

It surely will. I will try that. Basically what I think my problem is how to reference correctly the fields in a document.

[aaron-nimocks]

  "data": {
    "url": {
      "%context%": true,
      "%timefield%": "@timestamp",
      "index": "_all",
      "body": {
        "aggs": {
          "time_buckets": {
            "date_histogram": {
              "field": "@timestamp",
              "interval": {"%autointerval%": true},
              "extended_bounds": {
                "min": {"%timefilter%": "min"},
                "max": {"%timefilter%": "max"}
              },
              "min_doc_count": 0
            }
          }
        },
        "size": 0
      }
    },
    "format": {"property": "aggregations.time_buckets.buckets"}
  },

That's the default example when you create a new visualization. The bottom format field is what I think you are looking for. Except yours would be like {"property": "aggs.time_buckets.buckets"}. Then you can reference the data like _source.crypto.candle.high

[Adriann (Adrian)]

@aaron-nimocks

"body": {
        "aggs": {
          "time_buckets": {
            "date_histogram": {
              "field": "@timestamp",
              "interval": {"%autointerval%": true},
              "extended_bounds": {
                "min": {"%timefilter%": "min"},
                "max": {"%timefilter%": "max"}
              },
              "min_doc_count": 0
            }
          }
        }

I have tried a few iterations with your example but I still was shown the error of

Infinite extent for field "_source.crypto.candle.openTime": [Infinity, -Infinity]

Infinite extent for field "_source.crypto.candle.openTime": [Infinity, -Infinity]

Infinite extent for field "_source.crypto.candle.low": [Infinity, -Infinity]

Infinite extent for field "_source.crypto.candle.high": [Infinity, -Infinity]

Infinite extent for field "_source.crypto.candle.open": [Infinity, -Infinity]

Infinite extent for field "_source.crypto.candle.close": [Infinity, -Infinity]

Then I tried also this one with the same result

{
  "$schema": "https://vega.github.io/schema/vega-lite/v4.json",
  "width": 800,
    "autosize": {
    "type": "fit",
    "contains": "padding"
  },
  "description": "A candlestick chart inspired by an example in Protovis (http://mbostock.github.io/protovis/ex/candlestick.html)",
   "data": {
    "url": {
      "%context%": true,
      "%timefield%": "crypto.candle.openTime",
      "index": "_all",
      "body": {
      "aggs": {
    "time_buckets": {
      "date_histogram": {
        "field": "crypto.candle.openTime",
        "calendar_interval": "1h",
        "time_zone": "Europe/Warsaw",
        "min_doc_count": 1
      },
      "aggs": {
        "1": {
          "max": {
            "field": "crypto.candle.high"
          }
        },
        "3": {
          "top_hits": {
            "docvalue_fields": [
              {
                "field": "crypto.candle.close"
              }
            ],
            "_source": "crypto.candle.close",
            "size": 1,
            "sort": [
              {
                "crypto.candle.openTime": {
                  "order": "desc"
                }
              }
            ]
          }
        },
        "4": {
          "min": {
            "field": "crypto.candle.open"
          }
        },
        "5": {
          "top_hits": {
            "docvalue_fields": [
              {
                "field": "crypto.candle.open"
              }
            ],
            "_source": "crypto.candle.open",
            "size": 1,
            "sort": [
              {
                "crypto.candle.openTime": {
                  "order": "asc"
                }
              }
            ]
          }
        }
      }
    }
  
        },
        "size": 0
      }
    },
    "format": {"property": "aggregations.time_buckets.buckets"}
  },

  "encoding": {
    "x": {
      "field": "_source.crypto.candle.openTime",
      "type": "temporal",
      "title": "Date",
      "axis": {
        "format": "%Y-%m-%dT%H:%M:%SZ",
        "labelAngle": -45,
        "title": "Date"
      }
    },
    "y": {
      "type": "quantitative",
      "scale": {"zero": false},
      "axis": {"title": "Price"}
    }
    // ,
    // "color": {
    //   "condition": {
    //     "test": "datum.open < datum.close",
    //     "value": "#06982d"
    //   },
    //   "value": "#ae1325"
    // }
  },
  "layer": [
    {
      "mark": "rule",
      "encoding": {
        "y": {"field": "_source.crypto.candle.low"},
        "y2": {"field": "_source.crypto.candle.high"}
      }
    },
    {
      "mark": "bar",
      "encoding": {
        "y": {"field": "_source.crypto.candle.open"},
        "y2": {"field": "_source.crypto.candle.close"}
      }
    }
  ]
}

[Adriann (Adrian)]

Ok, so I got something moving.

This is how It looks right now and how my query looks like. I will work more on this now I have a much bigger understanding of these tools. @aaron-nimocks thank you very much for your input!

{
  "$schema": "https://vega.github.io/schema/vega-lite/v4.json",
  "width": 800,
    "autosize": {
    "type": "fit",
    "contains": "padding"
  },
  "description": "A candlestick chart inspired by an example in Protovis (http://mbostock.github.io/protovis/ex/candlestick.html)",
   "data": {
    "url": {
      "%context%": true,
      "%timefield%": "crypto.candle.openTime",
      "index": "_all",
      "body": {
      "aggs": {
    "time_buckets": {
      "date_histogram": {
        "field": "crypto.candle.openTime",
        "calendar_interval": "1h",
        "time_zone": "Europe/Warsaw",
        "min_doc_count": 1
      },
      "aggs": {
        "high": {
          "max": {
            "field": "crypto.candle.high"
          }
        },
        "open": {
          "max": {
            "field": "crypto.candle.open"
          }
        },
        "close": {
          "min": {
            "field": "crypto.candle.close"
          }
        },
        "low": {
          "max": {
            "field": "crypto.candle.low"
          }
        },
      }
    }
  
        },
        "size": 0
      }
    },
    "format": {"property": "aggregations.time_buckets.buckets"}
  },

  "encoding": {
    "x": {
      "field": "key",
      "type": "temporal",
      "title": "Date",
      // "axis": {
      //   "format": "%Y-%m-%dT%H:%M:%SZ",
      //   "labelAngle": -45,
      //   "title": "Date"
      // }
    },
    "y": {
      "type": "quantitative",
      "scale": {"zero": false},
      "axis": {"title": "Price"}
    }
    // ,
    // "color": {
    //   "condition": {
    //     "test": "datum.open < datum.close",
    //     "value": "#06982d"
    //   },
    //   "value": "#ae1325"
    // }
  },
  "layer": [
    {
      "mark": "rule",
      "encoding": {
        "y": {"field": "high.value"},
        "y2": {"field": "low.value"}
      }
    },
    {
      "mark": "bar",
      "encoding": {
        "y": {"field": "close.value"},
        "y2": {"field": "open.value"}
      }
    }
  ]
}

[aaron-nimocks]

Nice. Looks like you are catching on quickly. If you need anything else with this please open a new thread and feel free to tag me. Good luck!