antvis/G2
posted by hustcc almost 2 years ago
posted by hustcc almost 2 years ago
The issue has been closed
【特性】图表类型支持:韦恩图 #5038
hustcc posted onGitHub
venn 的实现有两种方式:
1. 新增 venn mark
const data = [
{ sets: ['A'], size: 12, label: 'A' },
{ sets: ['B'], size: 12, label: 'B' },
{ sets: ['A', 'B'], size: 2, label: 'A&B' },
];
chart
.venn()
.data(data)
.encode('sets', 'sets')
.encode('size', 'size')
.encode('color', 'label') // default: sets.join('&')
.style('blendMode', 'multiply'); // 多种可选
chart.render()
2. 结合布局,使用 path mark 实现,不添加单独的 mark
const data = [
{ sets: ['A'], size: 12, label: 'A' },
{ sets: ['B'], size: 12, label: 'B' },
{ sets: ['A', 'B'], size: 2, label: 'A&B' },
];
chart
.path()
.data({
type: 'inline',
value: data,
transform: [{
type: 'venn',
sets: 'sets',
value: 'value',
blendMode: 'multiply',
}],
})
.encode('d', 'd')
.encode('color', 'color')
.style('blendMode', 'multiply'); // 多种可选
chart.render()
- vega
{
"$schema": "https://vega.github.io/schema/vega-lite/v5.json",
"data": {
"values": [
{"category": 1, "x": -10, "y": 0},
{"category": 2, "x": 10, "y": 0},
{"category": 3, "x": 0, "y": 4}
]
},
"view": {"stroke":"transparent"},
"mark": "circle",
"encoding": {
"x": {"field": "x", "type": "quantitative"
,"axis":null},
"y": {"field": "y", "type": "quantitative", "axis":null},
"color": {"field": "category", "type": "nominal",
"legend": {"orient": "none", "legendX":300, "legendY":-100}},
"size":{"value":100000}
}
}
- gg2plot2
# install.packages("ggVennDiagram")
library(ggVennDiagram)
# List of items
x <- list(A = 1:5, B = 2:7, C = 5:10)
# Venn diagram with percentages
ggVennDiagram(x,
label = "percent")