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

相关推荐
柃歌32 分钟前
【UCB CS 61B SP24】Lecture 7 - Lists 4: Arrays and Lists学习笔记
java·数据结构·笔记·学习·算法
JANGHIGH35 分钟前
c++ std::list使用笔记
c++·笔记·list
柃歌42 分钟前
【UCB CS 61B SP24】Lecture 4 - Lists 2: SLLists学习笔记
java·数据结构·笔记·学习·算法
流烟默1 小时前
vue和微信小程序处理markdown格式数据
前端·vue.js·微信小程序
大溪地C1 小时前
Git 合并冲突解决与状态分析笔记
笔记·git
BUG 劝退师2 小时前
C语言预处理学习笔记
c语言·笔记·学习
家里有只小肥猫4 小时前
uniApp小程序保存canvas图片
前端·小程序·uni-app
低代码布道师4 小时前
性格测评小程序10生成报告
低代码·小程序
花王江不语4 小时前
设计模式学习笔记
笔记·学习·设计模式
科技小E4 小时前
EasyRTC:基于WebRTC与P2P技术,开启智能硬件音视频交互的全新时代
网络·网络协议·小程序·webrtc·p2p·智能硬件·视频监控