Tracy 小笔记:微信小程序 mpx 雷达图的实现

使用文档:

https://www.kancloud.cn/xchhhh/wx-chart/399337

https://github.com/xiaolin3303/wx-charts

https://gitee.com/mirrors/wx-charts/#wx-charts

参数说明: https://github.com/xiaolin3303/wx-charts/issues/56

下载 dist 里的 wx-charts-min.js

<canvas class="cav" canvas-id="radarCanvas"></canvas>]

复制代码
    const WxCharts = require('../../api/wx-charts.js')
      const chart = new WxCharts({
        canvasId: 'radarCanvas',
        type: 'radar',
        categories: ['title1', 'title2', 'title3', 'title4', 'title5'],
        series: [{
          data: [0, 0, 0, 0, 0]
        }],
        width: 280,
        height: 280,
        extra: {
          radar: {
            max: 10,
            labelColor: '#ffffff',
            gridColor: '#8382cd'
          }
        },
        subtitleFontSize: 24,
        legend: false,
        fontSize: 24
      })
      chart.updateData({
        series: [{
          data: [8, 2,3,4,10]
        }]
      })

.cav

height 280px

max-width 100%

width 280px

margin 0 auto

相关推荐
Mixtral6 小时前
2026年4款学习转写工具测评:告别逐字整理,自动生成复习资料
笔记·学习·ai·语音转文字
鄭郑6 小时前
【playwright 学习笔记】原理讲解与基础操作 --- day01
笔记·学习
2301_810746317 小时前
CKA冲刺40天笔记 - day10 K8S namespace
笔记·容器·kubernetes·k8s
Yu_Lijing7 小时前
基于C++的《Head First设计模式》笔记——模式合作
c++·笔记·设计模式
代码游侠7 小时前
学习笔记——时钟系统与定时器
arm开发·笔记·单片机·嵌入式硬件·学习·架构
诸葛成7 小时前
渗透测试-信息收集
经验分享·笔记·课程设计
峰顶听歌的鲸鱼7 小时前
Kubernetes管理
运维·笔记·云原生·容器·kubernetes·云计算
CRMEB系统商城8 小时前
CRMEB多商户系统(PHP)- 移动端二开之基本容器组件使用
运维·开发语言·小程序·php
zhangrelay9 小时前
影响移动固态磁盘稳定性的原因有哪些呢?
笔记·学习
lkbhua莱克瓦2411 小时前
深入理解HTTP协议:从理论到SpringBoot实践
网络·笔记·后端·网络协议·http·javaweb