antvis/G2

【特性】图表类型支持:韦恩图 #5038

hustcc posted onGitHub

image


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()
posted by hustcc almost 2 years ago
  • 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")

image

posted by hustcc almost 2 years ago

Fund this Issue

$0.00
Funded

Pull requests