问题
This VEGA-lite demo of Table Bubble Plot uses all sizes, from small to big circles.
My script, illustrated below, is not using, there are only 2 or 3 sizes. How to enforce or say to VEGA-lite use all circle sizes?
{
"$schema": "https://vega.github.io/schema/vega-lite/v4.json",
"data": { "url":"/_sql/myTable"},
"mark": "circle",
"encoding": {
"y": {
"field": "instant",
"type": "ordinal",
"timeUnit": "day",
"sort": ["mon", "tue", "wed", "thu", "fri", "sat", "sun"]
},
"x": {
"field": "instant",
"type": "ordinal",
"timeUnit": "hours"
},
"size": {
"field": "n_pmin",
"type": "quantitative",
"aggregate": "avg"
},
"color": {
"field": "n_pmin",
"type": "quantitative",
"aggregate": "avg"
}
}
}
PS: ideal also change "only blue" gradient to "bluegreen", but I not see how to set color into color.
NOTES
for @Jim request, a sample:
[{"instant":"2020-04-23T14:46:42","n_pmin":2210086},
{"instant":"2020-04-23T15:05:01","n_pmin":2214909},
{"instant":"2020-04-23T16:05:01","n_pmin":2159652},
{"instant":"2020-04-23T17:05:01","n_pmin":2290159},
{"instant":"2020-04-23T18:05:01","n_pmin":2235739},
{"instant":"2020-04-23T19:05:01","n_pmin":2505914},
{"instant":"2020-04-23T20:05:01","n_pmin":2517069},
{"instant":"2020-04-23T21:05:01","n_pmin":2492883},
{"instant":"2020-04-23T22:05:01","n_pmin":2535839},
{"instant":"2020-04-23T23:05:01","n_pmin":2519568},
{"instant":"2020-04-24T00:05:02","n_pmin":2367309},
{"instant":"2020-04-24T01:05:01","n_pmin":2384885},
{"instant":"2020-04-24T02:05:01","n_pmin":2340421},
{"instant":"2020-04-24T03:05:01","n_pmin":2369579},
{"instant":"2020-04-24T04:05:01","n_pmin":2285203},
{"instant":"2020-04-24T05:05:01","n_pmin":2206629},
{"instant":"2020-04-24T06:05:01","n_pmin":2149411},
{"instant":"2020-04-24T07:05:01","n_pmin":2218313},
{"instant":"2020-04-24T08:05:01","n_pmin":2231320},
{"instant":"2020-04-24T09:05:01","n_pmin":2163876},
{"instant":"2020-04-24T10:05:01","n_pmin":2100388},
{"instant":"2020-04-24T11:05:01","n_pmin":2040520},
{"instant":"2020-04-24T12:05:02","n_pmin":2157928},
{"instant":"2020-04-24T13:05:01","n_pmin":2099753},
{"instant":"2020-04-24T15:05:01","n_pmin":2334844},
{"instant":"2020-04-24T16:05:01","n_pmin":2430831},
{"instant":"2020-04-24T17:05:01","n_pmin":2403722},
{"instant":"2020-04-24T18:05:02","n_pmin":2468541},
{"...":"..."},
{"instant":"2020-05-13T16:05:01","n_pmin":2717164},
{"instant":"2020-05-13T17:05:01","n_pmin":2794972},
{"instant":"2020-05-13T18:05:01","n_pmin":2824981},
{"instant":"2020-05-13T19:05:01","n_pmin":2852586},
{"instant":"2020-05-13T20:05:01","n_pmin":2868170}]
回答1:
Short answer to the main question,
How to enforce or say to VEGA-lite use all circle sizes?
Say "zero": false
.
But, let's see in more detail how to do it in a more handmade way, to understand when you can set scale.zero
to false
as faster solution.
You can adjust the properties you're interested using the scale
specification in the relevant encodings.
For the color scheme, you can set scale.scheme
to any of the options listed in Vega Color Schemes.
For the sizes, you can set the scale.domain
and scale.range
to desired values, where domain
is the span of numbers in data space, and range
is the area of associated legend marks in square pixels.
Alternatively, you can set scale.zero
to false
to automatically adjust the domain, and leave out the zero value (which is what is causing the "missing" circles in your chart).
Putting it together, it might look like this, using the sample data you provided (vega editor):
{
"$schema": "https://vega.github.io/schema/vega-lite/v4.json",
"data": {
"values": [
{"instant": "2020-04-23T14:46:42", "n_pmin": 2210086},
{"instant": "2020-04-23T15:05:01", "n_pmin": 2214909},
{"instant": "2020-04-23T16:05:01", "n_pmin": 2159652},
{"instant": "2020-04-23T17:05:01", "n_pmin": 2290159},
{"instant": "2020-04-23T18:05:01", "n_pmin": 2235739},
{"instant": "2020-04-23T19:05:01", "n_pmin": 2505914},
{"instant": "2020-04-23T20:05:01", "n_pmin": 2517069},
{"instant": "2020-04-23T21:05:01", "n_pmin": 2492883},
{"instant": "2020-04-23T22:05:01", "n_pmin": 2535839},
{"instant": "2020-04-23T23:05:01", "n_pmin": 2519568},
{"instant": "2020-04-24T00:05:02", "n_pmin": 2367309},
{"instant": "2020-04-24T01:05:01", "n_pmin": 2384885},
{"instant": "2020-04-24T02:05:01", "n_pmin": 2340421},
{"instant": "2020-04-24T03:05:01", "n_pmin": 2369579},
{"instant": "2020-04-24T04:05:01", "n_pmin": 2285203},
{"instant": "2020-04-24T05:05:01", "n_pmin": 2206629},
{"instant": "2020-04-24T06:05:01", "n_pmin": 2149411},
{"instant": "2020-04-24T07:05:01", "n_pmin": 2218313},
{"instant": "2020-04-24T08:05:01", "n_pmin": 2231320},
{"instant": "2020-04-24T09:05:01", "n_pmin": 2163876},
{"instant": "2020-04-24T10:05:01", "n_pmin": 2100388},
{"instant": "2020-04-24T11:05:01", "n_pmin": 2040520},
{"instant": "2020-04-24T12:05:02", "n_pmin": 2157928},
{"instant": "2020-04-24T13:05:01", "n_pmin": 2099753},
{"instant": "2020-04-24T15:05:01", "n_pmin": 2334844},
{"instant": "2020-04-24T16:05:01", "n_pmin": 2430831},
{"instant": "2020-04-24T17:05:01", "n_pmin": 2403722},
{"instant": "2020-04-24T18:05:02", "n_pmin": 2468541},
{"instant": "2020-05-13T16:05:01", "n_pmin": 2717164},
{"instant": "2020-05-13T17:05:01", "n_pmin": 2794972},
{"instant": "2020-05-13T18:05:01", "n_pmin": 2824981},
{"instant": "2020-05-13T19:05:01", "n_pmin": 2852586},
{"instant": "2020-05-13T20:05:01", "n_pmin": 2868170}
]
},
"mark": "circle",
"encoding": {
"y": {
"field": "instant",
"type": "ordinal",
"timeUnit": "day",
"sort": ["mon", "tue", "wed", "thu", "fri", "sat", "sun"]
},
"x": {"field": "instant", "type": "ordinal", "timeUnit": "hours"},
"size": {
"field": "n_pmin",
"type": "quantitative",
"aggregate": "mean",
"scale": {"domain": [2200000, 3000000], "range": [100, 500]}
},
"color": {
"field": "n_pmin",
"type": "quantitative",
"aggregate": "mean",
"scale": {"domain": [2200000, 3000000], "scheme": "bluegreen"}
}
}
}
Automatic non-zero fit for dynamical data
Dynamical data (e.g. new data when refresh web page) is a typical case where we can't use constant domain ranges. In this other chart on VEGA editor both scale.zero
(of color and size) are setting to false
, resulting in an automatic scale range adjust:
"size": {
"field": "n_pmin",
"type": "quantitative",
"aggregate": "mean",
"scale": {"zero": false }
},
"color": {
"field": "n_pmin",
"type": "quantitative",
"aggregate": "mean",
"scale": {"scheme": "bluegreen", "zero": false}
}
来源:https://stackoverflow.com/questions/61646358/how-to-use-all-circle-sizes-in-a-punchcard