Version
2.0.8
Link to Minimal Reproduction
None
Steps to Reproduce
{
"type": "boxPlot",
"minField": "Lower_Whisker",
"maxField": "Upper_Whisker",
"q1Field": "Q1",
"medianField": "Meadian",
"q3Field": "Q3",
"outliersField": "Outliers",
"xField": [
"Dim_X",
"Dim_Color"
],
"seriesField": "Dim_ColorId",
"padding": 0,
"region": [
{
"clip": true
}
],
"animation": true,
"color": {
"type": "ordinal",
"domain": [
"male",
"female"
],
"range": [
"#8D72F6",
"#5766EC",
"#66A3FE",
"#51D5E6",
"#4EC0B3",
"#F9DF90",
"#F9AD71",
"#ED8888",
"#E9A0C3",
"#D77DD3"
]
},
"background": "transparent",
"data": {
"id": "boxPlot",
"values": [
{
"Survived": 0,
"Sex": "male",
"count": 54,
"mean": 31.99074074074074,
"Q1": 20.5,
"Meadian": 28.75,
"Q3": 40.375,
"iqr": 19.875,
"Min": 1,
"Max": 71,
"Lower_Whisker": 1,
"Upper_Whisker": 65,
"Outliers": [
71
],
"MeaId": "Age",
"MeaName": "Age",
"Dim_X": "0",
"Dim_Color": "male",
"Dim_ColorId": "male"
},
{
"Survived": 1,
"Sex": "female",
"count": 31,
"mean": 30.741935483870968,
"Q1": 22,
"Meadian": 33,
"Q3": 36,
"iqr": 14,
"Min": 2,
"Max": 63,
"Lower_Whisker": 2,
"Upper_Whisker": 55,
"Outliers": [
58,
63
],
"MeaId": "Age",
"MeaName": "Age",
"Dim_X": "1",
"Dim_Color": "female",
"Dim_ColorId": "female"
},
{
"Survived": 0,
"Sex": "female",
"count": 3,
"mean": 26.333333333333332,
"Q1": 17,
"Meadian": 24,
"Q3": 34.5,
"iqr": 17.5,
"Min": 10,
"Max": 45,
"Lower_Whisker": 10,
"Upper_Whisker": 45,
"Outliers": [],
"MeaId": "Age",
"MeaName": "Age",
"Dim_X": "0",
"Dim_Color": "female",
"Dim_ColorId": "female"
},
{
"Survived": 1,
"Sex": "male",
"count": 12,
"mean": 22.868333333333336,
"Q1": 13.5,
"Meadian": 28.5,
"Q3": 33,
"iqr": 19.5,
"Min": 0.42,
"Max": 39,
"Lower_Whisker": 0.42,
"Upper_Whisker": 39,
"Outliers": [],
"MeaId": "Age",
"MeaName": "Age",
"Dim_X": "1",
"Dim_Color": "male",
"Dim_ColorId": "male"
}
],
"fields": {}
},
"large": false,
"largeThreshold": null,
"progressiveStep": 400,
"progressiveThreshold": null,
"axes": [
{
"visible": true,
"type": "band",
"orient": "bottom",
"maxHeight": 140,
"sampling": true,
"hover": true,
"label": {
"visible": true,
"flush": true,
"space": 8,
"style": {
"maxLineWidth": 80,
"fill": "#8F959E",
"angle": 0,
"fontSize": 12,
"fontWeight": 400
},
"autoHideMethod": "greedy",
"lastVisible": true
},
"title": {
"visible": false,
"text": "Survived",
"style": {
"fill": "#606773",
"fontSize": 12,
"fontWeight": 400
}
},
"tick": {
"visible": false,
"tickSize": 4,
"inside": false,
"style": {
"stroke": "#21252C"
}
},
"grid": {
"visible": true,
"style": {
"lineWidth": 0.5,
"stroke": "#E3E5EB",
"lineDash": [
4,
2
]
}
},
"domainLine": {
"visible": false,
"style": {
"lineWidth": 1,
"stroke": "#21252C"
}
},
"paddingInner": [
0.15,
0.1
],
"paddingOuter": [
0.075,
0.1
]
},
{
"visible": true,
"type": "linear",
"base": 10,
"orient": "left",
"nice": true,
"zero": true,
"inverse": false,
"label": {
"space": 8,
"visible": true,
"style": {
"fill": "#8F959E",
"angle": 0,
"fontSize": 12,
"fontWeight": 400
}
},
"title": {
"visible": false,
"text": "",
"style": {
"fill": "#606773",
"fontSize": 12,
"fontWeight": 400
}
},
"tick": {
"visible": false,
"tickSize": 4,
"inside": false,
"style": {
"stroke": "#21252C"
}
},
"grid": {
"visible": true,
"style": {
"lineWidth": 0.5,
"stroke": "#E3E5EB",
"lineDash": [
4,
2
]
}
},
"domainLine": {
"visible": false,
"style": {
"lineWidth": 1,
"stroke": "#21252C"
}
},
"innerOffset": {
"top": 12
}
}
],
"label": {
"visible": true,
"style": {
"stroke": "#fff"
},
"smartInvert": false,
"overlap": {
"hideOnHit": true,
"clampForce": true
}
},
"tooltip": {
"visible": true,
"style": {
"panel": {
"padding": 7,
"border": {
"radius": 12,
"width": 1,
"color": "#e3e5e8"
},
"backgroundColor": "#fff"
},
"keyLabel": {
"lineHeight": 12,
"fontSize": 12,
"fontColor": "#606773"
},
"valueLabel": {
"lineHeight": 12,
"fontSize": 12,
"fontColor": "#21252c",
"fontWeight": "medium"
},
"titleLabel": {
"fontSize": 12,
"lineHeight": 12,
"fontColor": "#21252c",
"fontWeight": "bold"
}
},
"mark": {
"title": {
"visible": false
},
"content": [
{
"visible": true,
"hasShape": true,
"shapeType": "rectRound",
"key": "Survived"
},
{
"visible": true,
"hasShape": true,
"shapeType": "rectRound",
"key": "Sex"
},
[
{
"visible": true,
"hasShape": true,
"shapeType": "rectRound",
"key": "Max"
},
{
"visible": true,
"hasShape": true,
"shapeType": "rectRound",
"key": "Q3"
},
{
"visible": true,
"hasShape": true,
"shapeType": "rectRound",
"key": "Meadian"
},
{
"visible": true,
"hasShape": true,
"shapeType": "rectRound",
"key": "Q1"
},
{
"visible": true,
"hasShape": true,
"shapeType": "rectRound",
"key": "Min"
}
]
]
},
"dimension": {
"visible": false
}
},
"legends": {
"type": "discrete",
"visible": true,
"maxCol": 1,
"maxRow": 1,
"autoPage": true,
"orient": "right",
"position": "start",
"item": {
"focus": true,
"maxWidth": "30%",
"focusIconStyle": {
"size": 14,
"fill": "#606773",
"fontWeight": 400
},
"shape": {
"space": 6,
"state": {
"unSelected": {
"opacity": 0.2,
"fillOpacity": 1
}
}
},
"label": {
"style": {
"fontSize": 12,
"fill": "#606773",
"fontWeight": 400
},
"state": {
"unSelected": {
"fill": "#606773",
"fillOpacity": 0.8
}
}
},
"background": {
"state": {
"selectedHover": {
"fill": "#606773",
"fillOpacity": 0.05
},
"unSelectedHover": {
"fill": null
}
}
}
},
"pager": {
"textStyle": {
"fill": "#606773"
},
"handler": {
"style": {
"fill": "#89909D"
},
"state": {
"disable": {
"fill": "#F1F2F5"
}
}
}
},
"padding": 0
},
"crosshair": {
"xField": {
"visible": true,
"line": {
"type": "rect",
"style": {
"lineWidth": 0,
"opacity": 0.2,
"fill": "#3641594d"
}
},
"label": {
"visible": true,
"labelBackground": {
"visible": true,
"style": {
"fill": "#364159"
}
},
"style": {
"fill": "#ffffff"
}
}
}
},
"bar": {
"style": {
"visible": true,
"fillOpacity": 1,
"lineWidth": 1
},
"state": {
"hover": {
"fillOpacity": 0.6
}
}
}
}
Current Behavior
Outlier Color is colors[3]
Expected Behavior
Outliear Color same as boxplot
Environment
- OS:
- Browser:
- Framework:
Any additional comments?
No response
Version
2.0.8
Link to Minimal Reproduction
None
Steps to Reproduce
{
"type": "boxPlot",
"minField": "Lower_Whisker",
"maxField": "Upper_Whisker",
"q1Field": "Q1",
"medianField": "Meadian",
"q3Field": "Q3",
"outliersField": "Outliers",
"xField": [
"Dim_X",
"Dim_Color"
],
"seriesField": "Dim_ColorId",
"padding": 0,
"region": [
{
"clip": true
}
],
"animation": true,
"color": {
"type": "ordinal",
"domain": [
"male",
"female"
],
"range": [
"#8D72F6",
"#5766EC",
"#66A3FE",
"#51D5E6",
"#4EC0B3",
"#F9DF90",
"#F9AD71",
"#ED8888",
"#E9A0C3",
"#D77DD3"
]
},
"background": "transparent",
"data": {
"id": "boxPlot",
"values": [
{
"Survived": 0,
"Sex": "male",
"count": 54,
"mean": 31.99074074074074,
"Q1": 20.5,
"Meadian": 28.75,
"Q3": 40.375,
"iqr": 19.875,
"Min": 1,
"Max": 71,
"Lower_Whisker": 1,
"Upper_Whisker": 65,
"Outliers": [
71
],
"MeaId": "Age",
"MeaName": "Age",
"Dim_X": "0",
"Dim_Color": "male",
"Dim_ColorId": "male"
},
{
"Survived": 1,
"Sex": "female",
"count": 31,
"mean": 30.741935483870968,
"Q1": 22,
"Meadian": 33,
"Q3": 36,
"iqr": 14,
"Min": 2,
"Max": 63,
"Lower_Whisker": 2,
"Upper_Whisker": 55,
"Outliers": [
58,
63
],
"MeaId": "Age",
"MeaName": "Age",
"Dim_X": "1",
"Dim_Color": "female",
"Dim_ColorId": "female"
},
{
"Survived": 0,
"Sex": "female",
"count": 3,
"mean": 26.333333333333332,
"Q1": 17,
"Meadian": 24,
"Q3": 34.5,
"iqr": 17.5,
"Min": 10,
"Max": 45,
"Lower_Whisker": 10,
"Upper_Whisker": 45,
"Outliers": [],
"MeaId": "Age",
"MeaName": "Age",
"Dim_X": "0",
"Dim_Color": "female",
"Dim_ColorId": "female"
},
{
"Survived": 1,
"Sex": "male",
"count": 12,
"mean": 22.868333333333336,
"Q1": 13.5,
"Meadian": 28.5,
"Q3": 33,
"iqr": 19.5,
"Min": 0.42,
"Max": 39,
"Lower_Whisker": 0.42,
"Upper_Whisker": 39,
"Outliers": [],
"MeaId": "Age",
"MeaName": "Age",
"Dim_X": "1",
"Dim_Color": "male",
"Dim_ColorId": "male"
}
],
"fields": {}
},
"large": false,
"largeThreshold": null,
"progressiveStep": 400,
"progressiveThreshold": null,
"axes": [
{
"visible": true,
"type": "band",
"orient": "bottom",
"maxHeight": 140,
"sampling": true,
"hover": true,
"label": {
"visible": true,
"flush": true,
"space": 8,
"style": {
"maxLineWidth": 80,
"fill": "#8F959E",
"angle": 0,
"fontSize": 12,
"fontWeight": 400
},
"autoHideMethod": "greedy",
"lastVisible": true
},
"title": {
"visible": false,
"text": "Survived",
"style": {
"fill": "#606773",
"fontSize": 12,
"fontWeight": 400
}
},
"tick": {
"visible": false,
"tickSize": 4,
"inside": false,
"style": {
"stroke": "#21252C"
}
},
"grid": {
"visible": true,
"style": {
"lineWidth": 0.5,
"stroke": "#E3E5EB",
"lineDash": [
4,
2
]
}
},
"domainLine": {
"visible": false,
"style": {
"lineWidth": 1,
"stroke": "#21252C"
}
},
"paddingInner": [
0.15,
0.1
],
"paddingOuter": [
0.075,
0.1
]
},
{
"visible": true,
"type": "linear",
"base": 10,
"orient": "left",
"nice": true,
"zero": true,
"inverse": false,
"label": {
"space": 8,
"visible": true,
"style": {
"fill": "#8F959E",
"angle": 0,
"fontSize": 12,
"fontWeight": 400
}
},
"title": {
"visible": false,
"text": "",
"style": {
"fill": "#606773",
"fontSize": 12,
"fontWeight": 400
}
},
"tick": {
"visible": false,
"tickSize": 4,
"inside": false,
"style": {
"stroke": "#21252C"
}
},
"grid": {
"visible": true,
"style": {
"lineWidth": 0.5,
"stroke": "#E3E5EB",
"lineDash": [
4,
2
]
}
},
"domainLine": {
"visible": false,
"style": {
"lineWidth": 1,
"stroke": "#21252C"
}
},
"innerOffset": {
"top": 12
}
}
],
"label": {
"visible": true,
"style": {
"stroke": "#fff"
},
"smartInvert": false,
"overlap": {
"hideOnHit": true,
"clampForce": true
}
},
"tooltip": {
"visible": true,
"style": {
"panel": {
"padding": 7,
"border": {
"radius": 12,
"width": 1,
"color": "#e3e5e8"
},
"backgroundColor": "#fff"
},
"keyLabel": {
"lineHeight": 12,
"fontSize": 12,
"fontColor": "#606773"
},
"valueLabel": {
"lineHeight": 12,
"fontSize": 12,
"fontColor": "#21252c",
"fontWeight": "medium"
},
"titleLabel": {
"fontSize": 12,
"lineHeight": 12,
"fontColor": "#21252c",
"fontWeight": "bold"
}
},
"mark": {
"title": {
"visible": false
},
"content": [
{
"visible": true,
"hasShape": true,
"shapeType": "rectRound",
"key": "Survived"
},
{
"visible": true,
"hasShape": true,
"shapeType": "rectRound",
"key": "Sex"
},
[
{
"visible": true,
"hasShape": true,
"shapeType": "rectRound",
"key": "Max"
},
{
"visible": true,
"hasShape": true,
"shapeType": "rectRound",
"key": "Q3"
},
{
"visible": true,
"hasShape": true,
"shapeType": "rectRound",
"key": "Meadian"
},
{
"visible": true,
"hasShape": true,
"shapeType": "rectRound",
"key": "Q1"
},
{
"visible": true,
"hasShape": true,
"shapeType": "rectRound",
"key": "Min"
}
]
]
},
"dimension": {
"visible": false
}
},
"legends": {
"type": "discrete",
"visible": true,
"maxCol": 1,
"maxRow": 1,
"autoPage": true,
"orient": "right",
"position": "start",
"item": {
"focus": true,
"maxWidth": "30%",
"focusIconStyle": {
"size": 14,
"fill": "#606773",
"fontWeight": 400
},
"shape": {
"space": 6,
"state": {
"unSelected": {
"opacity": 0.2,
"fillOpacity": 1
}
}
},
"label": {
"style": {
"fontSize": 12,
"fill": "#606773",
"fontWeight": 400
},
"state": {
"unSelected": {
"fill": "#606773",
"fillOpacity": 0.8
}
}
},
"background": {
"state": {
"selectedHover": {
"fill": "#606773",
"fillOpacity": 0.05
},
"unSelectedHover": {
"fill": null
}
}
}
},
"pager": {
"textStyle": {
"fill": "#606773"
},
"handler": {
"style": {
"fill": "#89909D"
},
"state": {
"disable": {
"fill": "#F1F2F5"
}
}
}
},
"padding": 0
},
"crosshair": {
"xField": {
"visible": true,
"line": {
"type": "rect",
"style": {
"lineWidth": 0,
"opacity": 0.2,
"fill": "#3641594d"
}
},
"label": {
"visible": true,
"labelBackground": {
"visible": true,
"style": {
"fill": "#364159"
}
},
"style": {
"fill": "#ffffff"
}
}
}
},
"bar": {
"style": {
"visible": true,
"fillOpacity": 1,
"lineWidth": 1
},
"state": {
"hover": {
"fillOpacity": 0.6
}
}
}
}
Current Behavior
Outlier Color is colors[3]
Expected Behavior
Outliear Color same as boxplot
Environment
Any additional comments?
No response