网易云音乐歌名可视化:词云生成与GitHub-Pages部署实践

引言

本文将基于前一篇爬取的网易云音乐数据, 利用Python的wordcloudmatplotlib等库, 对歌名数据进行深入的词云可视化分析. 我们将探索不同random_state对词云布局的影响, 并详细介绍如何将生成的词云图部署到GitHub Pages, 实现数据可视化的在线展示. 介绍了如何从原始数据出发, 生成超酷词云图, 并将其部署到 GitHub Pages 上.

词云预览


▶️ 点击预览词云交互 ◀️

脚本地址:

项目地址: Gazer

utils.py

visualization.py

main.py

代码结构和使用方法

文件结构

txt 复制代码
Gazer/
├── NeteaseCloudMusicGaze/
│   ├── data/
│   │   ├── processed/
│   │   ├── raw/
│   │   │   └── me_music_data.json
│   │   └── title_stopwords.txt
│   ├── output/
│   │   └── visualizations/
│   ├── src/
│   │   ├── __init__.py  # 确保 src 是一个 Python 包
│   │   ├── utils.py     # 包含工具函数
│   │   └── visualization.py # 主要的可视化逻辑
│   └── main.py          # 程序的入口点, 用于调用 src 中的函数
└── ...

代码结构

  1. utils.py

    1. load_stopwords_from_file 从指定文件路径加载停用词列表, 并将其转换为集合. 如果文件不存在, 则返回空集合, 并记录错误日志
    2. load_json_data 加载爬取的 JSON 数据文件. 如果文件路径错误或 JSON 格式不正确, 将捕获异常并打印错误信息.
    3. load_and_extract_text 从爬取的 JSON 文件加载数据并提取 title 字段(即歌曲名), 将这些值组成一个列表返回. 如果文件加载失败或数据提取失败, 会进行相应的错误处理.
  2. visualization.py

    1. generate_wordcloud 根据文本列表生成词云图, 并返回词频字典
    2. save_word_frequencies_to_csv 将词频字典保存到 CSV 文件
    3. visualize_keywords 调用以上两个函数, 并且可视化关键词数据, 生成词云图并保存词频到 CSV 文件
  3. main.py

    主脚本, 调用 utils.pyvisualization.py 中的函数

使用方法

  1. 确保已经根据上一篇文档中的方法爬取了相应的数据, 确保 json 文件格式正确, 为一个字典列表.
  2. 安装依赖: pip install wordcloud matplotlib jieba numpy , 或者克隆项目代码后 pip install -r requirements.txt
  3. 修改 main.py 文件中的配置:
    • 填写 data_path 爬取的 json 文件路径
    • 填写 output_dir 输出的词云图和词频 csv 文件路径

代码分析

文件读取

之前爬取的 JSON 文件是一个包含多个字典的列表, 那么 load_json_data 函数如果成功加载, 就会返回一个列表, 这个列表里面包含的就是你的 JSON 文件中的那些字典.

以我的 me_music_data.json 为例, 文件内容是这样的(假设只有 2 条):

json 复制代码
[
    {
        "title": "Common Denominator [Bonus Track]",
        "singer": "Justin Bieber",
        "album": "My World",
        "comment": 3118
    },
    {
        "title": "I Found a Reason",
        "singer": "Cat Power",
        "album": "V for Vendetta",
        "comment": 841
    }
]

那么 load_json_data 函数加载成功后, 返回的 data 变量就会是一个列表:

py 复制代码
data = [
    {
        "title": "Common Denominator [Bonus Track]",
        "singer": "Justin Bieber",
        "album": "My World",
        "comment": 3118
    },
    {
        "title": "I Found a Reason",
        "singer": "Cat Power",
        "album": "V for Vendetta",
        "comment": 841
    }
]

然后你就可以通过索引访问列表中的每一个字典, 例如 data[0] 就是第一个字典, data[1] 就是第二个字典, 以此类推. 并且可以通过键值对的方式访问字典中的每一个值, 例如data[0]["title"]就是"Common Denominator [Bonus Track]".

停用词

为了后续更多的数据处理, 将 TITLE_STOPWORDS 写入文件, 并创建一个函数来读取它.

E:\Gazer\NeteaseCloudMusicGaze\data\ 目录下手动创建一个名为 title_stopwords.txt 的文本文件, 每个停用词占一行.

这里提供了一些适用于歌名的停用词示例. 为了获得更加精确的可视化效果, 建议你先运行一次 main.py, 然后根据生成的词频 CSV 文件(例如word_frequencies_me_music_data.csv), 观察高频出现的、但对你的分析目标没有实际意义的词语, 并将它们添加到 title_stopwords.txt 文件中. 之后再次运行main.py, 观察词云图的变化.

txt 复制代码
、
版
feat
翻自
Cover
EDIT
Instrumental
插曲
version
ver
Piano
Mix
丶

WorldCloud 类一些常用参数及其含义和说明

py 复制代码
wordcloud = WordCloud(
    width=960,   # 词云图宽度(px), 默认为 400
    height=600,  # 词云图高度(px), 默认为 200
    background_color=None,  # 设置背景颜色为透明, 或自定义如"white", "#000000", 默认为 "black"
    stopwords=stopwords,
    font_path=DEFAULT_FONT_PATH,
    max_words=200,              # 词云图中显示的最大词数, 默认为 200
    max_font_size=100, # 词云图中最大的字体大小, 可以根据你的数据量调整, 默认为None, 表示自动根据词频调整
    random_state=42,   # 随机数种子, 用于控制词云图的布局, 设置相同的值可以得到相同的布局
    mode="RGBA"        # 颜色模式, "RGB" 或 "RGBA", 默认为 "RGB" 
    # ... 还有很多其他参数, 具体可以参考官方文档
)

这些参数都不需要你全部设置, 只有在你需要自定义某些效果的时候设置就行了. 你可以根据自己的需求调整这些参数, 生成各种各样的词云图.

  • wordcloud.generate(text): 根据文本生成词云 . 这一步会根据传入的文本 text, 统计词频, 应用停用词, 计算每个词的位置和大小, 最终生成词云图. 但是这个时候词云图还在内存里. 这里面的 text 就是所有歌名使用空格连接起来的一个超级长的字符串.
  • wordcloud.to_file(output_path): 将生成的词云图保存到文件 . 这一步将内存中的词云图渲染成图片, 并保存到指定的路径 output_path.
  • wordcloud.words_: 获取词云中每个词及其对应的归一化频率 . 这是一个字典属性, 包含了生成词云图的词语及其频率信息, 后续save_word_frequencies_to_csv函数会使用这个字典属性.

简单来说, 这三行代码完成了"根据文本生成词云图"、"将词云图保存到文件"和"获取词频数据"这三个操作.

关于 random_state 随机种子

random_state 参数用于控制 wordcloud 库在生成词云图时涉及到的随机过程. 这些随机过程包括:

  • 词语位置的随机扰动 :为了避免词语重叠, wordcloud 会在一定范围内随机调整词语的位置.
  • 词语颜色的随机选择 :如果没有指定每个词的颜色, wordcloud 会从一个颜色列表中随机选择颜色.

random_state 的作用就是控制这些随机过程的可重复性.

  • 如果你设置了 random_state 为一个固定的整数 (例如 42, 或者其他任何整数), 那么每次运行代码时, 只要其他参数相同, 生成的词云图布局和颜色都会是一样的. 这对于调试代码、复现结果、保持结果一致性非常有用.
  • 如果你不设置 random_state , 或者将其设置为 None, 那么每次运行代码时, 词云图的布局和颜色都会随机变化.

42 这个数字本身并没有什么特殊的含义, 你可以把它设置为任何你喜欢的整数. 大家经常用 42, 可能是因为道格拉斯·亚当斯在他的科幻小说《银河系漫游指南》中说 "The Answer to the Ultimate Question of Life, the Universe, and Everything is 42" .

想来点不一样的?
  • 如果你想每次生成的词云图都不同 , 就不要设置 random_state , 或者设置为 None.

  • 如果你想尝试几种不同的布局, 但又希望每次运行代码时这几种布局能够固定 下来, 你可以尝试几个不同的 random_state , 例如 123, 看看哪个布局你最喜欢, 然后就固定使用那个值.

    不同的 random_state 值的布局预览

    生成这些预览图需要实际运行代码, 并设置不同的 random_state 值.

    这里提供一段代码, 让你能够自己生成并比较不同 random_state 值对应的词云图:

    python 复制代码
    from wordcloud import WordCloud, STOPWORDS
    import matplotlib.pyplot as plt
    import os
    from typing import List, Dict
    import csv
    from src.utils import load_json_data, load_and_extract_text, load_stopwords_from_file
    
    # 常量定义 (根据你的实际情况修改)
    WORD_HEADER = "Word"
    FREQUENCY_HEADER = "Frequency"
    DEFAULT_FONT_PATH = "msyh.ttc"
    TITLE_STOPWORDS_PATH = r"E:\Gazer\NeteaseCloudMusicGaze\data\title_stopwords.txt"
    DATA_PATH = r"E:\Gazer\NeteaseCloudMusicGaze\data\raw\me_music_data.json"
    OUTPUT_DIR = r"E:\Gazer\NeteaseCloudMusicGaze\output\visualizations"
    
    def generate_wordcloud(text_list: List[str], output_path: str, stopwords: set = None, random_state=None) -> Dict[str, float]:
        # 为了演示, 我把 random_state 提到这里了
        """
        根据文本列表生成词云图, 并返回词频字典. 
    
        (文档字符串的其他部分保持不变)
        """
        text = " ".join(text_list)
        if stopwords is None:
            stopwords = set(STOPWORDS)
            title_stopwords = load_stopwords_from_file(TITLE_STOPWORDS_PATH)
            stopwords.update(title_stopwords)
    
        wordcloud = WordCloud(
            width=960,
            height=600,
            background_color=None,
            stopwords=stopwords,
            font_path=DEFAULT_FONT_PATH,
            max_words=200,
            max_font_size=100,
            random_state=random_state,  # 使用传入的 random_state
            mode="RGBA"
        )
    
        wordcloud.generate(text)
        wordcloud.to_file(output_path)
        return wordcloud.words
    
    # 其他函数 (save_word_frequencies_to_csv, visualize_keywords) 保持不变
    
    if __name__ == "__main__":
        text_list = load_and_extract_text(DATA_PATH)
        os.makedirs(OUTPUT_DIR, exist_ok=True)
    
        # 尝试不同的 random_state 值
        for i in range(1, 6):  # 生成 5 个不同的 random_state 的结果
            output_path = os.path.join(OUTPUT_DIR, f"wordcloud_random_state_{i}.png")
            generate_wordcloud(text_list, output_path, random_state=i)
            print(f"已生成词云图:{output_path}")

    这段代码会生成 5 个词云图, 分别对应 random_state 值为 1、2、3、4、5 的情况. 你可以查看这些图片, 比较它们的布局差异.

visualize_keywords

这个函数是否重复了前两个函数的功能?

visualize_keywords 函数确实调用了 generate_wordcloudsave_word_frequencies_to_csv 这两个函数, 但它并不是简单地重复它们的功能, 而是**将它们组合起来, 形成一个更高级别的功能:从原始数据文件出发, 生成词云图和对应的词频 CSV 文件. **

可以这样理解:

  • generate_wordcloud 负责根据文本生成词云图, 并返回词频数据.
  • save_word_frequencies_to_csv 负责将词频数据保存到 CSV 文件.
  • visualize_keywords 负责统筹安排 , 它首先调用 load_and_extract_text 从数据文件提取文本, 然后调用 generate_wordcloud 生成词云图和获取词频, 最后调用 save_word_frequencies_to_csv 将词频保存到文件.

visualize_keywords 函数的作用是对数据进行可视化, 属于数据分析和数据可视化的高级功能, generate_wordcloudsave_word_frequencies_to_csv只是可视化过程中的步骤. 这样划分可以让代码的逻辑更清晰, 也更易于维护和扩展.

你可以把 generate_wordcloudsave_word_frequencies_to_csv 看作是工具函数 , 它们分别负责生成词云和保存词频这两个独立的任务. 而 visualize_keywords 则是一个更高级别的函数, 它利用这两个工具函数来完成一个更复杂的目标.

使用 wordart 获取更美观的词云可视化, 并使用 github-pages 部署

wordart 提供了可高度自定义的词云图, 可以使用生成的 csv 导入词频自定义词云颜色, 形状等. 完成后, 点 SAVE, 然后点 Share 将当前作品设置为公开, 点 Webpage 复制 iframe 标签.

html 复制代码
<iframe style="width:100%; height: 100%; border: none" src="https://cdn.wordart.com/iframe/qfwzk59spavk"></iframe>

iframe 标签放进创建的 HTML 文件的 body 中, 使用 Cursor / VS Code 的 Live Server 打开. 按 Ctrl+S 保存 HTML 到本地, 命名为 index.html, 以便后续在 github-pages 中部署. 这时也会自动下载一个文件夹 index_files, 包含 qfwzk59spavk.htmlwordart.min.js.下载. 此时可以直接用本地浏览器打开 index.html, 也可以获取鼠标和词云的交互功能.

这个方法完美地绕过了编码问题和 cdn.wordart.com 的访问限制, 直接将你在 Live Server 中看到的、已经渲染好的、包含交互式词云的页面完整地保存到了本地.

需要注意的地方:

  • Live Server 的依赖: 这种方法依赖于 Live Server 能够正确地渲染你的网页. 如果你的网页在 Live Server 中显示有问题, 那么保存下来的网页也会有问题.
  • iframe 的内容: 这种方法会将 iframe 中的内容 (也就是 qfwzk59spavk.html) 也一起保存下来. 这通常是没问题的, 但如果 iframe 中的内容非常大, 或者你不希望将 iframe 的内容保存到本地, 那么你需要手动编辑保存后的 HTML 文件, 删除 iframe 相关的代码.
  • 如果你之后需要部署到 GitHub, 你仍需检查 index.html 中的文件路径是否正确.
确保你已经为你的仓库开启 GitHub pages:

可以点击 开启 GitHub pages 教程 查看

开启后直接 push 到仓库同步, 等待 pages 部署完毕就能在 https://YourGithubUserName.github.io/RepositoryName/ 看到可交互式词云已经成功部署到网站.

相关推荐
HORSE RUNNING WILD1 小时前
解决 PicGo 上传 GitHub图床及Marp中Github图片编译常见难题指南
css·python·github
ElenaYu1 小时前
mac安装cast
python·macos·cast
qianmoQ1 小时前
GitHub 趋势日报 (2025年05月13日)
github
Dxy12393102161 小时前
python如何设置excel单元格边框样式
开发语言·python·excel
chaodaibing2 小时前
Python解析Excel入库如何做到行的拆分
开发语言·python·excel
dudly2 小时前
Python类的力量:第五篇:魔法方法与协议——让类拥有Python的“超能力”
开发语言·python
攻城狮7号3 小时前
Python爬虫第21节- 基础图形验证码识别实战
开发语言·爬虫·python·图形验证码识别
kpl_203 小时前
Python基础
开发语言·python
啥都鼓捣的小yao3 小时前
课程11. 计算机视觉、自编码器和生成对抗网络 (GAN)
人工智能·python·深度学习·神经网络·算法·生成对抗网络·计算机视觉