Question

您好我正在处理一个应用程序，我需要绘制多个维恩图。我去了jVenn jQuery插件（http://bioinfo.genotoul.fr/jvenn/documentation.html）。当你只想绘制1个维恩图时，它可以正常工作，但是当你试图绘制超过1个维恩图时，它根本不起作用。它只绘制了最后一个维恩图。

DEMOS

仅绘制1个维恩图（工作正常） https://jsfiddle.net/uhqqqrgh/

试图绘制超过1个维恩图（不工作） https://jsfiddle.net/uhqqqrgh/1/

HTML

<div id="example">

</div>

<div id="example1">

</div>

的jQuery

$(document).ready(function(){
  $('#example').jvenn({
    series: [{
        name: 'Actors',
        data: ["Marilyn Monroe", "Arnold Schwarzenegger", "Jack Nicholson", "Barbra Streisand", "Robert de Niro", "Dean Martin", "Harrison Ford"]
      }, {
        name: 'Singers',
        data: ["Freddy Mercury", "Barbra Streisand", "Dean Martin", "Ricky Martin", "Celine Dion", "Marilyn Monroe"]
      }]
  });


  $('#example1').jvenn({
    series: [{
        name: 'Models',
        data: ["Marilyn Monroe1", "Arnold Schwarzenegger", "Jack Nicholson", "Barbra Streisand", "Robert de Niro", "Dean Martin", "Harrison Ford"]
      }, {
        name: 'Directors',
        data: ["Freddy Mercury", "Barbra Streisand", "Dean Martin", "Ricky Martin", "Celine Dion", "Marilyn Monroe"]
      }]
  });
});

注意在演示中，初始jQuery是插件代码，启动jVenn的代码写在底部。

Answer 1

我检查了这个插件。它正在内部处理id，并且在选择任何元素时没有上下文传递。这就是为什么它总是在第一个容器内显示内容的原因。您必须选择其他插件，如D3.js。

可能是这个link会帮助你。

如何使用jVenn插件绘制多个维恩图

1 个答案: