This is the 2020-12-17 iteration of a demo Vega-Lite spec I'm working on for an experimental Power BI visual - currently codenamed "Deneb". Authors can add measures and columns to the visual, which generates a flat table dataset. This is bound to Vega and Vega-Lite as a named dataset, which the author can than use to generate their own visuals.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| { | |
| "$schema": "https://vega.github.io/schema/vega-lite/v4.json", | |
| "data": { | |
| "name": "values" | |
| }, | |
| "config": { | |
| "autosize": { | |
| "type": "fit", | |
| "contains": "padding" | |
| }, | |
| "mark": { | |
| "tooltip": true | |
| }, | |
| "axis": { | |
| "domain": false, | |
| "labelColor": "#605E5C", | |
| "labelFontSize": 12, | |
| "labelPadding": 5, | |
| "ticks": false, | |
| "tickCount": 5, | |
| "titleFontSize": 16, | |
| "titleFontWeight": "bold", | |
| "titleColor": "#605E5C" | |
| }, | |
| "text": { | |
| "baseline": "bottom", | |
| "color": "#605E5C", | |
| "align": "center", | |
| "dx": -2, | |
| "dy": -2, | |
| "y": 0, | |
| "fontSize": 10 | |
| }, | |
| "rule": { | |
| "size": 2, | |
| "color": "#484644" | |
| } | |
| }, | |
| "layer": [ | |
| { | |
| "transform": [ | |
| { | |
| "density": "Mean Temperature", | |
| "bandwidth": 0.3 | |
| } | |
| ], | |
| "mark": { | |
| "type": "area", | |
| "line": { | |
| "color": "#666666", | |
| "size": 0 | |
| }, | |
| "color": { | |
| "x1": 0, | |
| "y1": 1, | |
| "x2": 1, | |
| "y2": 1, | |
| "gradient": "linear", | |
| "stops": [ | |
| { | |
| "offset": 0, | |
| "color": "#2f78b3" | |
| }, | |
| { | |
| "offset": 1, | |
| "color": "#c5690d" | |
| } | |
| ] | |
| } | |
| }, | |
| "encoding": { | |
| "x": { | |
| "field": "value", | |
| "title": "Temperature (°C)", | |
| "type": "quantitative" | |
| }, | |
| "y": { | |
| "field": "density", | |
| "type": "quantitative", | |
| "title": "Density", | |
| "axis": { | |
| "format": ".0%" | |
| } | |
| } | |
| } | |
| }, | |
| { | |
| "description": "Median", | |
| "layer": [ | |
| { | |
| "mark": "rule", | |
| "encoding": { | |
| "x": { | |
| "aggregate": "median", | |
| "field": "Mean Temperature" | |
| } | |
| } | |
| }, | |
| { | |
| "mark": { | |
| "type": "text", | |
| "text": "Median" | |
| }, | |
| "encoding": { | |
| "x": { | |
| "aggregate": "median", | |
| "field": "Mean Temperature" | |
| } | |
| } | |
| } | |
| ] | |
| }, | |
| { | |
| "layer": [ | |
| { | |
| "description": "Lower Quartile", | |
| "mark": { | |
| "type": "rule", | |
| "strokeDash": [ | |
| 4, | |
| 4 | |
| ] | |
| }, | |
| "encoding": { | |
| "x": { | |
| "aggregate": "q1", | |
| "field": "Mean Temperature" | |
| } | |
| } | |
| }, | |
| { | |
| "mark": { | |
| "type": "text", | |
| "text": "Q1" | |
| }, | |
| "encoding": { | |
| "x": { | |
| "aggregate": "q1", | |
| "field": "Mean Temperature" | |
| } | |
| } | |
| } | |
| ] | |
| }, | |
| { | |
| "layer": [ | |
| { | |
| "description": "Upper Quartile", | |
| "mark": { | |
| "type": "rule", | |
| "strokeDash": [ | |
| 4, | |
| 4 | |
| ] | |
| }, | |
| "encoding": { | |
| "x": { | |
| "aggregate": "q3", | |
| "field": "Mean Temperature" | |
| } | |
| } | |
| }, | |
| { | |
| "mark": { | |
| "type": "text", | |
| "text": "Q3" | |
| }, | |
| "encoding": { | |
| "x": { | |
| "aggregate": "q3", | |
| "field": "Mean Temperature" | |
| } | |
| } | |
| } | |
| ] | |
| } | |
| ] | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Example showing the measure (Mean Temperature) and column added to the visual. The Sample column is used to ensure the grain of the data is correct for the Mean Temperature measure:
Putting the visual into focus mode (in Desktop, or if the report is in Edit mode in the Service), the author has access to the spec editor: