wordcloud2实现词云文字云效果代码

代码语言:html

所属分类:其他

代码描述:wordcloud2实现词云文字云效果代码

代码标签: wordcloud2 词云 文字云

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum=1.0,minimum=1.0,user-scalable=0" />
    <title>BFW NEW PAGE</title>
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/wordcloud2.js"></script>
    <style>
    </style>
</head>

<body>
    <canvas id="canvas" width="600" height="600"></canvas>
    <script>
        // 拿到canvas的dom
    const canvas = document.getElementById('canvas')
    // 需要渲染的词
    // 第二个参数值越大,显示的就越大
    const list = [
      ["百年孤独", 35],
       ["百年孤独", 12],
         ["百年孤独", 2],
      ["活着", 25],
      ["悲惨世界", 45],
       ["悲惨世界", 5],
        ["悲惨世界",34],
         ["百年孤独", 35],
       ["百年孤独", 12],
         ["百年孤独", 2],
      ["活着", 25],
      ["悲惨世界", 45],
       ["悲惨世界", 5],
        ["悲惨世界",34],
         ["百年孤独", 35],
       ["百年孤独", 12],
         ["百年孤独", 2],
      ["活着", 25],
      ["悲惨世界", 45],
       ["悲惨世界", 5],
        ["悲惨世界",34],
         ["百年孤独", 35],
       ["百年孤独", 12],
         ["百年孤独", 2],
      ["活着", 25],
      ["悲惨世界", 45],
       ["悲惨世界", 5],
        ["悲惨世界",34], ["百年孤独", 35],
       ["百年孤独", 12],
         ["百年孤独", 2],
      ["活着", 25],
      ["悲惨世界", 45],
       ["悲惨世界", 5],
        ["悲惨世界",34], ["百年孤独", 35],
       ["百年孤独", 12],
         ["百年孤独", 2],
      ["活着", 25],
      ["悲惨世界", 45],
       ["悲惨世界", 5],
        ["悲惨世界",34], ["百年孤独", 35],
       ["百年孤独&.........完整代码请登录后点击上方下载按钮下载查看

网友评论0