当前位置:   article > 正文

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

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>]

  1. const WxCharts = require('../../api/wx-charts.js')
  2. const chart = new WxCharts({
  3. canvasId: 'radarCanvas',
  4. type: 'radar',
  5. categories: ['title1', 'title2', 'title3', 'title4', 'title5'],
  6. series: [{
  7. data: [0, 0, 0, 0, 0]
  8. }],
  9. width: 280,
  10. height: 280,
  11. extra: {
  12. radar: {
  13. max: 10,
  14. labelColor: '#ffffff',
  15. gridColor: '#8382cd'
  16. }
  17. },
  18. subtitleFontSize: 24,
  19. legend: false,
  20. fontSize: 24
  21. })
  22. chart.updateData({
  23. series: [{
  24. data: [8, 2,3,4,10]
  25. }]
  26. })

  .cav

    height 280px

    max-width 100%

    width 280px

    margin 0 auto

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/Guff_9hys/article/detail/884212
推荐阅读
相关标签
  

闽ICP备14008679号