Lopwon Echarts 使用文档

版本型号：Lopwon Echarts
适用程序：Typecho
皮肤类型：插件
插件作者：Lopwon
作者博客：Lopwon.com
发布页面：Lopwon.com/lopwon-echarts.html
许可方式：付费使用
官方演示：Lopwon Echarts

我要购买：6.60元/人

付款时别忘了留下邮箱收取文件包，勿留 Gmail 邮箱。

插件说明

插件 Lopwon Echarts 依托 Echarts 开源项目，实现数据可视化，可以将图表插入文章内容中，可以同时使用多张图表，可以选择使用（折线图、柱形图、饼形图、雷达图）等图表类型。

此外，也对博客的文章类型（分类）和标签云进行可视化图表呈现，可以直观的显示出博客的风格偏好。

Echarts 开源项目，有着非常强大的自定义功能，可以说，能想到的需求，Echarts 都有办法实现，而且，使用文档和示例也是介绍的非常详细，为了操作简便，插件 Lopwon Echarts 的大部分功能和样式，基本沿用 Echarts 的默认设置。

插件更新

2023年09月25日 发布 Lopwon Echarts

使用方法

A 部署文件

1. 将压缩包里的文件夹 LopwonEcharts 及其内部的所有文件，上传至目录 usr/plugins 中。

2. 后台》控制台》插件，找到 Lopwon Echarts 并启用。

B 配置插件

后台》控制台》插件，找到 Lopwon Echarts 并设置，依喜好设置即可。

C 创建图表

后台》管理》文章（或独立页面），打开需要编辑的文章（或独立页面），除以下提到的事项外，其余正常操作即可。

一、新增自定义字段。

1. 新增自定义字段，字段名称必须填入以 ec_ 作为前缀的自定义名称，乱填无效，如：

    ec_a
    ec_love
    ec_888
    ec_自定义名称

2. 其中，在自定义名称时，有两个特殊的字段名称需单独使用，用于引入（文章类型）和（字符云图），以下会提到：

    ec_cate 文章类型
    ec_tags 字符云图

二、输入字段值。

1. 请严格按照以下格式要求输入字段值，才能在前台正确输出：

    图表类型,图表标题,数据单位
    图表类目A,图表类目B,图表类目C
    统计项目甲|项目甲的类目A数据,项目甲的类目B数据,项目甲的类目C数据
    统计项目乙|项目乙的类目A数据,项目乙的类目B数据,项目乙的类目C数据
    统计项目丙|项目丙的类目A数据,项目丙的类目B数据,项目丙的类目C数据

3. 以上格式有上下左右的先后顺序要求：

① 第一行：第一个元素配置图表类型；第二个元素配置图表标题；第三个元素配置数据单位，元素之间使用半角逗号隔开。

② 第二行：配置图表的类目，在二维图表中，通常为横坐标（X轴）的类目名称，名称之间使用半角逗号隔开。

③ 第三行及之后的行：配置图表的项目及数据，在二维图表中，通常为纵坐标（Y轴）的项目数据，每行输出一组数据，项目名称和数据组之间使用竖线 | 隔开，数据之间使用半角逗号隔开。

④ 注意：数据组的数据个数，需要和第二行的类目数量相对应，也有先后顺序要求，见下

2. 示例：

    bar,滇西南行九天八晚,元
    第一天,第二天,第三天,第四天,第五天,第六天,第七天,第八天,第九天
    吃的|131,26,123,109,71,101,85,34,34
    住的|168,168,110,110,98,128,128,128,0
    行的|290,0,73,32,57,44,15,39,273

3. 说明，在（吃的）行中的（109）表示（第四天）的花费是：109元，其他类同。

4. 其中，图表类型有 4 个有效值，分别为：

    折线图 line
    柱形图 bar
    饼形图 pie
    雷达图 radar

5. 其中，通过更换图表类型，可以实现同一数据以不同图表类型呈现，需要注意的是，当图表类型为饼形图（pie）时，只获取一行数据（即第三行），其余行（第四行及之后的行）的数据不被统计。

6. 注意：当自定义字段名称是以上提到的两个特殊的字段名称（ec_cate 和 ec_tags）时，这两个字段的值不用录入内容，留空即可。

三、在文章中引入字段名称。

1. 此编辑页面左侧的“内容文本框”中，在合适位置插入以下指定格式的内容：

2. 格式：(id="ec_自定义名称")

3. 示例：

    (id="ec_a")
    (id="ec_love")
    (id="ec_888")
    (id="ec_cate")
    (id="ec_tags")

4. 其中：

① (id="ec_cate") 引入字段 ec_cate 输出（文章类型）图表；
② (id="ec_tags") 引入字段 ec_tags 输出（字符云图）图表；
③ 其他的对应引入各自的字段输出各自的数据图表。

E 使用技巧

1. 如何自定义图表主题？详见插件 Lopwon Echarts 设置中的（图表换个装）。