mpvue使用wxchart虽然如此但发誓以后不做微信小程序的项目了

news/2024/7/10 2:42:34 标签: 微信小程序, 小程序, mpvue, vue

vue>mpvue使用wxchart

  • Step 步骤
    • docs 文档
    • 1.install 安装
    • 2.add < canvas > sign 添加标签
    • 3. import in your page 页面引入
    • 4. draw chart 画图
    • result

Step 步骤

docs 文档

https://www.npmjs.com/package/wx-chart/v/0.3.1

1.install 安装

npm install wx-chart --save-dev

2.add < canvas > sign 添加标签

<div>
      <canvas canvas-id="radarCanvas" disable-scroll="true" class="canvas"></canvas>
</div>

3. import in your page 页面引入

<script>
import wxcharts from '@/utils/wxcharts'
</script>

4. draw chart 画图

methods: {
    drawChart() {
      this.wxchart = new wxcharts({
        title: { fontSize: 20 },
        canvasId: 'radarCanvas',
        type: 'radar',
        categories: ['温度', '湿度', '光强', '有毒气体', '火焰'],
        series: [{ name: '指标', data: [90, 60, 55, 95, 87] }],

        height: 300,
        width: 300,
        extra: {
          radar: {
            max: 100
          }
        }
      })
    }
}

result

在这里插入图片描述


http://www.niftyadmin.cn/n/1717537.html

相关文章

flume mysql to hbase_Flume将数据从MySQL迁移到Hadoop

5 个答案:答案 0 :(得分&#xff1a;3)根据我的理解&#xff0c;Flume不是为了这个。Flume基本上用于读取数据源(平面文件)等日志&#xff0c;并以结构化方式将它们推送到接收器。Sqoop可以使用&#xff0c;试一试http://archive.cloudera.com/cdh/3/sqoop/SqoopUserGuide.html…

c语言常见关键字汇总

关键字是c语言内置的&#xff0c;可以直接用。 c语言常见关键字汇总 目录c语言常见关键字汇总auto&#xff08;automatic-自动的&#xff09;typedef(类型重定义&#xff09;register&#xff08;寄存器&#xff09;extern&#xff08;声明&#xff09;static(静态的&#xff…

l源码安装mysql升级_源码安装MySQL

一、安装单实例1、升级openssl#查看版本openssl version#openssl 安装包 openssl-1.1.0j.tar.gz#下载地址https://www.openssl.org/source/cd /usr/local/openssl-1.1.1./configmakemake install#受影响的文件夹#/usr/local/bin#/usr/local/include#/usr/local/lib#先查找 当前…

c语言自学教程——分支语句和循环语句

文章目录分支语句&#xff08;选择结构&#xff09;if语句if语句中的elseswitch语句switch语句中的breakswitch语句中的default子句循环语句while语句while语句中的breakwhile语句中的continuefor循环for循环中的break和continuedo…while循环do while循环中的break和continueg…

javaWeb构建登录界面(没办法应同学要求发一下,虽然很简单)

javaWeb构建登录界面javaWeb构建登录界面前言1.新建项目javaEE2.安装Tomcatidea配置3.安装maven仓库IDEA配置maven页面结构编写pom.xml文件添加mysql驱动4.编写前端页面5.编写后端servletJDBCUtilLoginServiceLoginServiceImplLoginPojoLoginMapperLoginMapperImplEnterForm操作…

学好c语言,自己写游戏自己玩——猜数字

使用函数调用、循环语句、随机数生成语句实现的小游戏 #include<stdio.h> #include<stdlib.h> #include<time.h> void menu() {printf("********************\n");printf("**** 1.play ****\n");printf("**** 0.exit ****…

c# winform常用记录

c# winform常用记录open a new page(打开新页面)comboBox 下拉框add elements by order 顺序添加元素insert elements 插入元素make default choose 默认选择DataGridVeiwset background color 设置背景色set table row background color 设置表头背景色set rows background co…

getchar和putchar函数

文章目录getchar&#xff08;输入字符、获取一个字符&#xff09;putchar&#xff08;输出一个字符&#xff09;基本用法清理缓冲器只打印0到9数字字符getchar&#xff08;输入字符、获取一个字符&#xff09; putchar&#xff08;输出一个字符&#xff09; 基本用法 int main…