如何为我的词云动态设置 maxItems？

Question

我正在制作一个简单的词云图：https://jsfiddle.net/kbhx64Ln/

它从云中最多 15 个项目开始。但是，我想根据计时器动态更新该数字。我有：

$(document).ready(function() {
  var cnt = 0;
  var interval = setInterval(function() {
    cnt += 1;
    console.log("drawing: " + cnt);
    draw(cnt);
  }, 3000);
});


anychart.onDocumentReady(function() {
  draw(15);
});

function draw(maxItems) {
  // create data
  var data = "Tyger, tyger, burning bright " +
    "In the forests of the night, " +
    "What immortal hand or eye " +
    "Could frame thy fearful symmetry? " +
    "In what distant deeps or skies " +
    "Burnt the fire of thine eyes? " +
    "On what wings dare he aspire? " +
    "What the hand dare seize the fire? " +
    "And what shoulder and what art " +
    "Could twist the sinews of thy heart? " +
    "And, when thy heart began to beat, " +
    "What dread hand and what dread feet? " +
    "What the hammer? what the chain? " +
    "In what furnace was thy brain? " +
    "What the anvil? what dread grasp " +
    "Dare its deadly terrors clasp? " +
    "When the stars threw down their spears, " +
    "And watered heaven with their tears, " +
    "Did He smile His work to see? " +
    "Did He who made the lamb make thee? " +
    "Tyger, tyger, burning bright " +
    "In the forests of the night, " +
    "What immortal hand or eye " +
    "Dare frame thy fearful symmetry? ";

  // create a chart
  var chart = anychart.tagCloud();

  // set the parsing mode and configure parsing settings
  chart.data(data, {
    mode: "by-word",
    maxItems: maxItems,
    ignoreItems: [
      "the",
      "and",
      "he",
      "or",
      "of",
      "in",
      "thy",
    ]
  });

  // set the chart title
  chart.title("Tag Cloud Chart: Data (Parsing Text)");

  // set the container id
  chart.container("container");

  // initiate drawing the chart
  chart.draw();
}

看来，虽然我可以用任何 maxItems 数开始，但我无法更新该数。我做错了什么？

编辑：看来我也无法更改 ignoreItems。有什么解决办法吗？

Answer 1

将云对象放入容器中并且每次刷新信息时删除云对象，删除图表对象，然后再次添加云对象。（重启图表）

$(document).ready(function() {
  var cnt = 0;

  var interval = setInterval(function() {
    cnt += 1;
    draw(cnt);
  }, 300);
});


anychart.onDocumentReady(function() {
  draw(1);
});

function draw(maxItems) {
  // create data
  var data = "Tyger, tyger, burning bright " +
    "In the forests of the night, " +
    "What immortal hand or eye " +
    "Could frame thy fearful symmetry? " +
    "In what distant deeps or skies " +
    "Burnt the fire of thine eyes? " +
    "On what wings dare he aspire? " +
    "What the hand dare seize the fire? " +
    "And what shoulder and what art " +
    "Could twist the sinews of thy heart? " +
    "And, when thy heart began to beat, " +
    "What dread hand and what dread feet? " +
    "What the hammer? what the chain? " +
    "In what furnace was thy brain? " +
    "What the anvil? what dread grasp " +
    "Dare its deadly terrors clasp? " +
    "When the stars threw down their spears, " +
    "And watered heaven with their tears, " +
    "Did He smile His work to see? " +
    "Did He who made the lamb make thee? " +
    "Tyger, tyger, burning bright " +
    "In the forests of the night, " +
    "What immortal hand or eye " +
    "Dare frame thy fearful symmetry? ";

  // create a chart
  var chart = anychart.tagCloud();

  // set the parsing mode and configure parsing settings
  chart.data(data, {
    mode: "by-word",
    maxItems: maxItems,
    ignoreItems: [
      "the",
      "and",
      "he",
      "or",
      "of",
      "in",
      "thy",
    ]
  });

  // set the chart title
  chart.title("Tag Cloud Chart: Data (Parsing Text)");

  // set the container id
  document.getElementById("cloud").remove();

  var cloud = document.createElement("div");
  cloud.id = "cloud";
  document.getElementById("container").appendChild(cloud);

  chart.container("cloud");

  // initiate drawing the chart
  chart.draw();
}

html,
body,
#container {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
}

<div id="container">
  <div id="cloud">
  </div>
</div>

<script src="https://code.jquery.com/jquery-3.5.0.min.js" crossorigin="anonymous"></script>
<script src="https://cdn.anychart.com/releases/8.7.1/js/anychart-core.min.js"></script>
<script src="https://cdn.anychart.com/releases/8.7.1/js/anychart-tag-cloud.min.js"></script>

如何为我的词云动态设置 maxItems？

How can I dynamically set maxItems for my word cloud?

javascript

jquery

anychart