From 010c04afd646ec0f4416e481d447bc9c9908d768 Mon Sep 17 00:00:00 2001 From: Nishant Bangarwa Date: Tue, 21 May 2024 23:07:56 +0530 Subject: [PATCH] Add examples --- rill-openrtb-prog-ads/charts/KPI.yaml | 220 ++++++++++++++++++ .../charts/area_rill_no_comparison.yaml | 79 +++++++ rill-openrtb-prog-ads/charts/area_simple.yaml | 34 +++ .../charts/bar_nomial_simple.yaml | 19 ++ .../charts/horizontal_bar_chart.yaml | 21 ++ .../charts/multi_scatter.yaml | 63 +++++ .../charts/scatter_simple.yaml | 28 +++ .../charts/stacked_area_chart.yaml | 50 ++++ rill-openrtb-prog-ads/charts/stacked_bar.yaml | 39 ++++ .../charts/stacked_bar_simple.yaml | 30 +++ .../charts/time_chart_sample.yaml | 69 ++++++ .../dashboards/custom-dashboard.yaml | 39 ++++ .../tmp/auction_data_raw/version.txt | 1 + .../tmp/bids_data_raw/version.txt | 1 + 14 files changed, 693 insertions(+) create mode 100644 rill-openrtb-prog-ads/charts/KPI.yaml create mode 100644 rill-openrtb-prog-ads/charts/area_rill_no_comparison.yaml create mode 100644 rill-openrtb-prog-ads/charts/area_simple.yaml create mode 100644 rill-openrtb-prog-ads/charts/bar_nomial_simple.yaml create mode 100644 rill-openrtb-prog-ads/charts/horizontal_bar_chart.yaml create mode 100644 rill-openrtb-prog-ads/charts/multi_scatter.yaml create mode 100644 rill-openrtb-prog-ads/charts/scatter_simple.yaml create mode 100644 rill-openrtb-prog-ads/charts/stacked_area_chart.yaml create mode 100644 rill-openrtb-prog-ads/charts/stacked_bar.yaml create mode 100644 rill-openrtb-prog-ads/charts/stacked_bar_simple.yaml create mode 100644 rill-openrtb-prog-ads/charts/time_chart_sample.yaml create mode 100644 rill-openrtb-prog-ads/dashboards/custom-dashboard.yaml create mode 100644 rill-openrtb-prog-ads/tmp/auction_data_raw/version.txt create mode 100644 rill-openrtb-prog-ads/tmp/bids_data_raw/version.txt diff --git a/rill-openrtb-prog-ads/charts/KPI.yaml b/rill-openrtb-prog-ads/charts/KPI.yaml new file mode 100644 index 0000000..cf1be6d --- /dev/null +++ b/rill-openrtb-prog-ads/charts/KPI.yaml @@ -0,0 +1,220 @@ +kind: component +data: + metrics_sql: | + SELECT advertiser_name, AGGREGATE(overall_spend) + FROM Bids_Sample_Dash + GROUP BY advertiser_name + ORDER BY overall_spend DESC + LIMIT 20 +vega_lite: | + { + "$schema": "https://vega.github.io/schema/vega-lite/v5.json", + "title": { + "text": "Sales YTD", + "anchor": "start", + "offset": -17, + "font": "Arial", + "fontSize": 16, + "fontWeight": 400, + "color": "#a0a0a0" + }, + "data": { + "values": [ + {"date": "2023-01-01", "value": 6000, "target": 10000}, + {"date": "2023-02-01", "value": 8000, "target": 10000}, + {"date": "2023-03-01", "value": 9000, "target": 10000}, + {"date": "2023-04-01", "value": 10000, "target": 12000}, + {"date": "2023-05-01", "value": 8000, "target": 12000}, + {"date": "2023-06-01", "value": 14000, "target": 12000}, + {"date": "2023-07-01", "value": 6000, "target": 14000}, + {"date": "2023-08-01", "value": 15000, "target": 14000}, + {"date": "2023-09-01", "value": 18000, "target": 14000}, + {"date": "2023-10-01", "value": 12000, "target": 16000}, + {"date": "2023-11-01", "value": 12000, "target": 16000}, + {"date": "2023-12-01", "value": 14000, "target": 16000} + ] + }, + "height": 100, + "width": 250, + "layer": [ + { + "mark": { + "type": "area", + "color": { + "x1": 1, + "y1": 1, + "x2": 1, + "y2": 0, + "gradient": "linear", + "stops": [ + {"offset": 0, "color": "white"}, + {"offset": 1, "color": "#ebebeb"} + ] + } + }, + "encoding": { + "x": {"field": "date", "type": "temporal", "axis": null}, + "y": {"field": "value", "type": "quantitative", "axis": null} + } + }, + { + "mark": { + "type": "line", + "color": "#9c9c9c", + "strokeWidth": 1, + "strokeDash": [3, 3] + }, + "encoding": { + "x": {"field": "date", "type": "temporal", "axis": null}, + "y": {"field": "target", "type": "quantitative", "axis": null} + } + }, + { + "mark": {"type": "line", "size": 1, "tooltip": true}, + "encoding": { + "color": {"value": "#000"}, + "x": {"field": "date", "type": "temporal"}, + "y": {"field": "value", "type": "quantitative"} + } + }, + { + "transform": [ + { + "joinaggregate": [{"op": "max", "field": "date", "as": "latest_date"}] + }, + {"filter": "datum.date == datum.latest_date"} + ], + "mark": { + "type": "point", + "tooltip": true, + "fill": "white", + "strokeWidth": 1 + }, + "encoding": { + "color": { + "condition": { + "test": "datum.value >= datum.target", + "value": "green" + }, + "value": "red" + }, + "opacity": {"value": 1}, + "size": {"value": 70}, + "x": {"field": "date", "type": "temporal"}, + "y": {"field": "value", "type": "quantitative"} + } + }, + { + "transform": [ + {"joinaggregate": [{"op": "max", "field": "value", "as": "maxVal"}]}, + { + "joinaggregate": [{"op": "max", "field": "date", "as": "latest_date"}] + }, + {"filter": "datum.date == datum.latest_date"}, + { + "calculate": "timeFormat(datum.date,'%b-%Y') + ': '+ format(datum.value,'$,.2s')", + "as": "Title" + } + ], + "mark": { + "type": "text", + "dx": 0, + "dy": -45, + "xOffset": 0, + "yOffset": -10, + "angle": 0, + "align": "right", + "baseline": "bottom", + "font": "sans-serif", + "fontSize": 18, + "fontStyle": "normal", + "fontWeight": "normal", + "limit": 0 + }, + "encoding": { + "x": {"field": "date", "type": "temporal"}, + "y": {"field": "maxVal", "type": "quantitative"}, + "text": {"field": "Title"} + } + }, + { + "transform": [ + {"joinaggregate": [{"op": "max", "field": "value", "as": "maxVal"}]}, + { + "joinaggregate": [{"op": "max", "field": "date", "as": "latest_date"}] + }, + {"filter": "datum.date == datum.latest_date"}, + { + "calculate": "'⚋ Target: '+ format(datum.target,'$,.2s')", + "as": "targetText" + } + ], + "mark": { + "type": "text", + "dx": 0, + "dy": -25, + "xOffset": 0, + "yOffset": -10, + "angle": 0, + "align": "right", + "baseline": "bottom", + "font": "sans-serif", + "fontSize": 12, + "fontStyle": "normal", + "fontWeight": "normal", + "limit": 0, + "color": {"expr": "datum.value < datum.target ? 'red' : 'green'"} + }, + "encoding": { + "x": {"field": "date", "type": "temporal"}, + "y": {"field": "maxVal", "type": "quantitative"}, + "text": {"field": "targetText"} + } + }, + { + "transform": [ + {"joinaggregate": [{"op": "max", "field": "value", "as": "maxVal"}]}, + {"calculate": "toDate(datum.date)", "as": "parsed_date"}, + { + "window": [{"op": "rank", "as": "rank"}], + "sort": [{"field": "parsed_date", "order": "descending"}] + }, + {"filter": "datum.rank == 1 || datum.rank == 2"}, + {"calculate": "datum.rank == 1 ? datum.value : 0", "as": "val1"}, + {"calculate": "datum.rank == 2 ? datum.value : 0", "as": "val2"}, + {"joinaggregate": [{"op": "max", "field": "val1", "as": "val1X"}]}, + {"joinaggregate": [{"op": "max", "field": "val2", "as": "val2X"}]}, + {"calculate": "max(datum.val1X) - max(datum.val2X)", "as": "finalVal"}, + { + "calculate": "datum.rank == 1 ? (datum.finalVal > 0 ? '▲ ' : datum.finalVal < 0 ? '▼ ' : '▷ ') + 'Change this month: ' + (datum.finalVal > 0 ? '+' : '') + format(datum.finalVal,'$,.2s') : ''", + "as": "subTitle" + } + ], + "mark": { + "type": "text", + "dx": 0, + "dy": -15, + "xOffset": 0, + "yOffset": -15, + "angle": 0, + "align": "right", + "baseline": "top", + "font": "sans-serif", + "fontSize": 12, + "fontStyle": "normal", + "fontWeight": "normal", + "limit": 0, + "color": { + "expr": "datum.finalVal < 0 ? 'red' : datum.finalVal > 0 ? 'green' : 'gray'" + } + }, + "encoding": { + "x": {"field": "date", "type": "temporal"}, + "y": {"field": "maxVal", "type": "quantitative"}, + "text": {"field": "subTitle"} + } + } + ], + "view": {"stroke": "transparent"}, + "config": {} + } \ No newline at end of file diff --git a/rill-openrtb-prog-ads/charts/area_rill_no_comparison.yaml b/rill-openrtb-prog-ads/charts/area_rill_no_comparison.yaml new file mode 100644 index 0000000..f71cca4 --- /dev/null +++ b/rill-openrtb-prog-ads/charts/area_rill_no_comparison.yaml @@ -0,0 +1,79 @@ +kind: component +data: + metrics_sql: | + SELECT + __time as time_grain_hour, + overall_spend + FROM + bids + ORDER BY + __time DESC + LIMIT 200 + OFFSET 0 + +vega_lite: | + { + "$schema": "https://vega.github.io/schema/vega-lite/v5.json", + "description": "Google's stock price over time.", + "data": {"name": "table"}, + "width": 700, + "height": 400, + "layer": [ + { + "mark": { + "type": "area" + }, + "encoding": { + "x": { + "field": "time_grain_hour", + "type": "temporal", + "axis": {"title": ""} + }, + "y": { + "axis": { + "orient": "right", + "title": "" + }, + "field": "overall_spend", + "type": "quantitative" + }, + "tooltip": [ + {"title": "Time", "field": "time_grain_hour", "type": "temporal"}, + {"title": "Price", "field": "overall_spend", "type": "quantitative"} + ] + } + }, + { + "transform": [{"filter": {"param": "hover", "empty": false}}], + "mark": {"type": "rule", "color": "royalblue", "strokeWidth": 3}, + "encoding": { + "x": {"type": "temporal", "field": "time_grain_hour"}, + "y": {"field": "overall_spend", "type": "quantitative"} + + } + }, + { + "mark": "point", + "encoding": { + "x": {"field": "time_grain_hour", "type": "temporal"}, + "y": {"field": "overall_spend", "type": "quantitative"}, + "opacity": { + "condition": {"param": "hover", "value": 1}, + "value": 0 + } + }, + "params": [ + { + "name": "hover", + "select": { + "type": "point", + "encodings": ["x"], + "nearest": true, + "on": "mouseover" + } + } + ] + } + ] + } + diff --git a/rill-openrtb-prog-ads/charts/area_simple.yaml b/rill-openrtb-prog-ads/charts/area_simple.yaml new file mode 100644 index 0000000..31d667e --- /dev/null +++ b/rill-openrtb-prog-ads/charts/area_simple.yaml @@ -0,0 +1,34 @@ +## This is a sample comment +kind: component +data: + metrics_sql: | + SELECT + __time as time_grain_hour, + overall_spend + FROM + bids + ORDER BY + __time DESC + LIMIT 200 + OFFSET 0 + +vega_lite: | + { + "$schema": "https://vega.github.io/schema/vega-lite/v5.json", + "description": "Simple area chart", + "data": {"name": "table"}, + "width": "container", + "height": 400, + "mark": {"type": "area"}, + "encoding": { + "x": { + "field": "time_grain_hour", + "type": "temporal" + }, + "y": { + "field": "overall_spend", + "type": "quantitative" + } + } + } + diff --git a/rill-openrtb-prog-ads/charts/bar_nomial_simple.yaml b/rill-openrtb-prog-ads/charts/bar_nomial_simple.yaml new file mode 100644 index 0000000..ae770d1 --- /dev/null +++ b/rill-openrtb-prog-ads/charts/bar_nomial_simple.yaml @@ -0,0 +1,19 @@ +kind: component +data: + metrics_sql: | + SELECT advertiser_name, overall_spend + FROM bids + ORDER BY overall_spend DESC + LIMIT 20 + +vega_lite: | + { + "$schema": "https://vega.github.io/schema/vega-lite/v5.json", + "data": {"name": "table"}, + "mark": "bar", + "width": "container", + "encoding": { + "x": {"field": "advertiser_name", "type": "nominal"}, + "y": {"field": "overall_spend", "type": "quantitative"} + } + } \ No newline at end of file diff --git a/rill-openrtb-prog-ads/charts/horizontal_bar_chart.yaml b/rill-openrtb-prog-ads/charts/horizontal_bar_chart.yaml new file mode 100644 index 0000000..96378d6 --- /dev/null +++ b/rill-openrtb-prog-ads/charts/horizontal_bar_chart.yaml @@ -0,0 +1,21 @@ +# Bar chart for top advertiser names + +kind: component +data: + metrics_sql: | + SELECT advertiser_name, overall_spend + FROM bids + ORDER BY overall_spend DESC + LIMIT 20 + +vega_lite: | + { + "$schema": "https://vega.github.io/schema/vega-lite/v5.json", + "data": {"name": "table"}, + "mark": "bar", + "width": "container", + "encoding": { + "y": {"axis": {"orient": "left"}, "field": "advertiser_name", "type": "nominal", "sort": null}, + "x": {"field": "overall_spend", "type": "quantitative"} + } + } \ No newline at end of file diff --git a/rill-openrtb-prog-ads/charts/multi_scatter.yaml b/rill-openrtb-prog-ads/charts/multi_scatter.yaml new file mode 100644 index 0000000..360a0f6 --- /dev/null +++ b/rill-openrtb-prog-ads/charts/multi_scatter.yaml @@ -0,0 +1,63 @@ +kind: component +data: + metrics_sql: | + SELECT advertiser_name, + overall_spend, + total_bids, + impressions + FROM + bids + ORDER BY + overall_spend DESC + LIMIT 10000 + +vega_lite: | + { + "$schema": "https://vega.github.io/schema/vega-lite/v5.json", + "repeat": { + "row": ["overall_spend", "total_bids", "impressions"], + "column": ["impressions", "total_bids", "overall_spend"] + }, + "spec": { + "data": {"name": "table"}, + "mark": "point", + "params": [ + { + "name": "brush", + "select": { + "type": "interval", + "resolve": "union", + "on": "[pointerdown[event.shiftKey], window:pointerup] > window:pointermove!", + "translate": "[pointerdown[event.shiftKey], window:pointerup] > window:pointermove!", + "zoom": "wheel![event.shiftKey]" + } + }, + { + "name": "grid", + "select": { + "type": "interval", + "resolve": "global", + "translate": "[pointerdown[!event.shiftKey], window:pointerup] > window:pointermove!", + "zoom": "wheel![!event.shiftKey]" + }, + "bind": "scales" + } + ], + "encoding": { + "x": {"field": {"repeat": "column"}, "type": "quantitative"}, + "y": { + "field": {"repeat": "row"}, + "type": "quantitative", + "axis": {"minExtent": 30} + }, + "color": { + "condition": { + "param": "brush", + "field": "advertiser_name", + "type": "nominal" + }, + "value": "grey" + } + } + } + } diff --git a/rill-openrtb-prog-ads/charts/scatter_simple.yaml b/rill-openrtb-prog-ads/charts/scatter_simple.yaml new file mode 100644 index 0000000..9e1529f --- /dev/null +++ b/rill-openrtb-prog-ads/charts/scatter_simple.yaml @@ -0,0 +1,28 @@ +kind: component +data: + metrics_sql: | + SELECT advertiser_name, + overall_spend, + impressions + FROM bids + LIMIT 200 + +vega_lite: | + { + "$schema": "https://vega.github.io/schema/vega-lite/v5.json", + "description": "Drag out a rectangular brush to highlight points.", + "data": {"name": "table"}, + "params": [{ + "name": "brush", + "select": "interval" + }], + "mark": "point", + "encoding": { + "x": {"field": "overall_spend", "type": "quantitative"}, + "y": {"field": "impressions", "type": "quantitative"}, + "color": { + "condition": {"param": "brush", "field": "advertiser_name", "type": "nominal"}, + "value": "grey" + } + } + } diff --git a/rill-openrtb-prog-ads/charts/stacked_area_chart.yaml b/rill-openrtb-prog-ads/charts/stacked_area_chart.yaml new file mode 100644 index 0000000..da5e72a --- /dev/null +++ b/rill-openrtb-prog-ads/charts/stacked_area_chart.yaml @@ -0,0 +1,50 @@ +kind: component +data: + metrics_sql: | + SELECT + player_size, + __time as time_grain_hour, + impressions + FROM + bids + ORDER BY + __time DESC + LIMIT 200 + OFFSET 0 + +vega_lite: | + { + "$schema": "https://vega.github.io/schema/vega-lite/v5.json", + "description": "Stacked area chart with individual stroke colors for each line and different fill colors", + "data": {"name": "table"}, + "width": 600, + "height": 400, + "layer": [ + { + "mark": {"type": "area"}, + "encoding": { + "x": {"field": "time_grain_hour", "type": "temporal"}, + "y": {"field": "impressions", "type": "quantitative", "stack": "zero"}, + "color": {"field": "player_size", "type": "nominal"}, + "opacity": { + "condition": {"param": "hover", "empty": false, "value": 1}, + "value": 0.8 + } + }, + "params": [ + { + "name": "hover", + "select": {"type": "point", "on": "pointerover"} + } + ] + }, + { + "mark": {"type": "line", "strokeWidth": 1}, + "encoding": { + "x": {"field": "time_grain_hour", "type": "temporal"}, + "y": {"field": "impressions", "type": "quantitative", "stack": "zero"}, + "stroke": {"field": "player_size", "type": "nominal"} + } + } + ] + } diff --git a/rill-openrtb-prog-ads/charts/stacked_bar.yaml b/rill-openrtb-prog-ads/charts/stacked_bar.yaml new file mode 100644 index 0000000..2efc3f3 --- /dev/null +++ b/rill-openrtb-prog-ads/charts/stacked_bar.yaml @@ -0,0 +1,39 @@ +kind: component +data: + metrics_sql: | + SELECT + device_type, + __time as time_grain_hour, + overall_spend + FROM + bids + + ORDER BY + __time DESC + LIMIT 200 + OFFSET 0 + +vega_lite: | + { + "$schema": "https://vega.github.io/schema/vega-lite/v5.json", + "description": "Google's stock price over time.", + "data": {"name": "table"}, + "width": 700, + "height": 400, + "mark": {"type": "bar", "width": { "band": 0.75}}, + "encoding": { + "x": {"field": "time_grain_hour", "type": "temporal", "timeUnit": "monthdatehours"}, + "y": {"field": "overall_spend", "type": "quantitative"}, + "color": {"field": "device_type", "type": "nominal", "legend": null}, + "opacity": { + "condition": {"param": "hover", "empty": false, "value": 1}, + "value": 0.8 + } + }, + "params": [{ + "name": "hover", + "select": {"type": "point", "on": "mouseover"} + }] + } + + diff --git a/rill-openrtb-prog-ads/charts/stacked_bar_simple.yaml b/rill-openrtb-prog-ads/charts/stacked_bar_simple.yaml new file mode 100644 index 0000000..2490bb4 --- /dev/null +++ b/rill-openrtb-prog-ads/charts/stacked_bar_simple.yaml @@ -0,0 +1,30 @@ +kind: component +data: + metrics_sql: | + SELECT + player_size, + __time as time_grain_hour, + overall_spend + FROM + bids + ORDER BY + __time DESC + LIMIT 200 + OFFSET 0 + +vega_lite: | + { + "$schema": "https://vega.github.io/schema/vega-lite/v5.json", + "description": "Google's stock price over time.", + "data": {"name": "table"}, + "width": 700, + "height": 400, + + "mark": {"type": "bar", "width": 40}, + "encoding": { + "x": {"field": "time_grain_hour", "type": "ordinal"}, + "y": {"field": "overall_spend", "type": "quantitative"}, + "color": {"field": "player_size", "type": "nominal"} + } + } + diff --git a/rill-openrtb-prog-ads/charts/time_chart_sample.yaml b/rill-openrtb-prog-ads/charts/time_chart_sample.yaml new file mode 100644 index 0000000..9815f80 --- /dev/null +++ b/rill-openrtb-prog-ads/charts/time_chart_sample.yaml @@ -0,0 +1,69 @@ +kind: component +data: + metrics_sql: | + SELECT + __time as time_grain_hour, + overall_spend + FROM + bids + ORDER BY + __time DESC + LIMIT 200 + OFFSET 0 + + +vega_lite: | + { + "$schema": "https://vega.github.io/schema/vega-lite/v5.json", + "description": "A bar chart.", + "width": "container", + "data": { + "name": "table" + }, + "mark": { + "type": "bar", + "width": { + "band": 0.5 + } + }, + "encoding": { + "x": { + "field": "time_grain_hour", + "type": "temporal", + "timeUnit": "yearmonthdatehours", + "axis": { + "title": "" + }, + "scale": { + "domain": [ + "2023-09-16T02:30:00.000Z", + "2023-09-08T00:00:59.000Z" + ] + } + }, + "y": { + "field": "overall_spend", + "type": "quantitative", + "axis": { + "title": "" + } + }, + "opacity": { + "condition": { + "param": "hover", + "empty": false, + "value": 1 + }, + "value": 0.8 + } + }, + "params": [ + { + "name": "hover", + "select": { + "type": "point", + "on": "pointerover" + } + } + ] + } \ No newline at end of file diff --git a/rill-openrtb-prog-ads/dashboards/custom-dashboard.yaml b/rill-openrtb-prog-ads/dashboards/custom-dashboard.yaml new file mode 100644 index 0000000..ad4619f --- /dev/null +++ b/rill-openrtb-prog-ads/dashboards/custom-dashboard.yaml @@ -0,0 +1,39 @@ +kind: dashboard +columns: 9 +gap: 5 +items: + - component: area_rill_no_comparison + height: 4 + width: 10 + x: 0 + y: 2 + - component: KPI + height: 2 + width: 3 + x: 0 + y: 0 + - component: KPI + height: 2 + width: 3 + x: 3 + y: 0 + - component: KPI + height: 2 + width: 3 + x: 6 + y: 0 + - component: stacked_bar + height: 4 + width: 5 + x: 0 + y: 6 + - component: time_chart_sample + height: 4 + width: 4 + x: 5 + y: 6 + - component: stacked_area_chart + height: 5 + width: 9 + x: 0 + y: 10 diff --git a/rill-openrtb-prog-ads/tmp/auction_data_raw/version.txt b/rill-openrtb-prog-ads/tmp/auction_data_raw/version.txt new file mode 100644 index 0000000..13a36ba --- /dev/null +++ b/rill-openrtb-prog-ads/tmp/auction_data_raw/version.txt @@ -0,0 +1 @@ +1716312160050 \ No newline at end of file diff --git a/rill-openrtb-prog-ads/tmp/bids_data_raw/version.txt b/rill-openrtb-prog-ads/tmp/bids_data_raw/version.txt new file mode 100644 index 0000000..d53f0b8 --- /dev/null +++ b/rill-openrtb-prog-ads/tmp/bids_data_raw/version.txt @@ -0,0 +1 @@ +1716312161486 \ No newline at end of file