微信小程序canvas绘制曲线图表

最新推荐文章于 2023-09-11 15:07:50 发布
最新推荐文章于 2023-09-11 15:07:50 发布
阅读量3.8k 收藏 36
点赞数 4
分类专栏： 曲线图 文章标签： 小程序 canvas 贝塞尔曲线
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_45094203/article/details/108886182
版权

先上图 不能耽误大家时间。由于也是才入手小程序 很多不会代码有点乱 看官些能用就用不能用就看看哈。
在这里插入图片描述
view代码

<view class="efficacy">
	<!-- 曲线 -->
	<view class="chartsBox">
		<view style="display:flex;justify-content: space-between;">
			<view class="efficacyName" style="color:{{curve.lineColor}}">{{curve.name}}
				<view style="background:{{curve.lineColor}}"></view>
			</view>
		</view>
		<view class="canvasBox">
			<scroll-view class="temp_day_box" scroll-x bindscroll='scrollCanvas'>
				<canvas canvas-id='curveCanvas' id='curveCanvas' class='curveCanvas'> </canvas>
				<canvas canvas-id='lines' id='lines'  class='lines'> </canvas>
				<view class="xCoordinate" bindtap="getZuoBiao" >
					<view class="xCoordinateTime{{index}} xCoordinateTime" wx:for="{{curve.date}}" wx:key="index" data-index="{{index}}" >
          {{item}}
    <!-- 分数提示线 -->
						<cover-view class="scoreTip" wx-if="{{numShiow&&index==tipIndex}}">
							<cover-view class="scoreBg" style="height:{{144}}px;">
								<cover-view class="score" style="top:-{{180-tipHeight}}px;color:{{curve.lineColor}}">{{score}}</cover-view>
								<cover-view class="scoreBox" style="top:-{{174-tipHeight}}px;background:{{curve.lineColor}}"></cover-view>
							</cover-view>
							<cover-view class="scoreLine" style="height:{{190-tipHeight}}px;background:{{curve.lineColor}}"></cover-view>
						</cover-view>
					</view>
				</view>
			</scroll-view>
		</view>
	
	</view>
</view>

css代码

/* pages/curveCharts/curveCharts.wxss *//* pages/experience/tests/tests.wxss */
.efficacy{
  /* width: 100%; */
  /* height: 1000px; */
  background: #eef7fe;
  padding:30rpx;
}
/* 曲线 */
.efficacyName {
  color: #e2c162;
  font-size: 26rpx;
  font-weight: bold;
  display: flex;
  margin-bottom: 30rpx;
  line-height: 30rpx;
}

.efficacyName>view {
  width: 26rpx;
  height: 26rpx;
  margin-left: 10rpx;
  border-radius: 4rpx;
}
.chartsBox{
  position: relative;
  width: 100%;
  margin-bottom:40rpx;
}
.canvasBox{
  width:690rpx;
  height:420rpx;
  position: relative;
  background: #fff;
  border-radius: 30rpx;
  box-shadow: 0 10px 15px rgba(0,0,0,0.1);
  overflow: auto;
  overflow-y:hidden;
  /* overflow-x:scroll; */
}
.curveCanvas{
  /* width:100%; */
  width:450px;
  height:500rpx;
  position: relative;
  left: -10px;
  top: -28px;
}
.xCoordinate{
  position: absolute;
  top: 0;
  /* left:30rpx; */
  display: flex;
  /* width: 690rpx; */
  height: 100%;
  overflow: auto;
}
.xCoordinateTime{
  padding-left:4rpx;
  font-size:20rpx;
  color: #fff;
  /* color: red; */
  width: 98rpx;
}
.lines{
  /* width:100%; */
  width:450px;
  position: absolute;
  top: -21px;
  left: -10px;
}
canvas{
  width:none;
  height: none;
}
.scoreTip{
position: absolute;
top:0;
height:345rpx;
}
.scoreBg{
  width:80rpx;
  height:170rpx;
  background: rgba(255, 255, 255, 0.8);
  display: flex;
  flex-direction: column;
  align-items: center;
 justify-content: flex-end;
  position: relative;
}
.score{
  color: #d2b567;
  font-size: 20rpx;
  position: relative;
  bottom: 10rpx;
  top: 10rpx;
}
.scoreBox{
  width: 12rpx;
  height: 12rpx;
  background:#d2b567;
  border-radius: 50%;
   position: relative;
  bottom: 10rpx;
  top: 10rpx;
}
.scoreLine{
  width:8rpx;
  height:119px;
  background:#d2b567;
  border-radius:3rpx;
 position: absolute;
  left:0;
  right: 0;
  bottom:8rpx;
margin:auto;
}

js代码

// pages/experience/tests/tests.js
let curve = {
  mW: 345, //canvas宽
  mH: 250, //canvas高
  mCenter: 180, //中心点
  hCenter: 125, //中心点
  points: []
};
Page({

  /**
   * 页面的初始数据
   */
  data: {
    // 数字提示
    numShiow: false,
    tipLeft: 0, //提示的x坐标
    tipHeight: 0, //提示线条的高度
    curveColText: ['100', '80', '60', '40', '20', '0'], //y轴
    // 主要数据
    curve: {
      bgColor: "#fcede0",
      date: ["09-08", "09-09", "09-11", "09-12", "09-14", "09-16", "09-17", "09-18", "09-28"],
      lineColor: "#f9d3b5",
      list: [62, 67, 76, 70, 76, 85, 85, 88, 57],
      name: "肤色",
      xData: [],
    },
    tipIndex: 0,
    whatShow: false,
    getshow: false,
  
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    let {curveColText } = this.data //y坐标
    let {bgColor,date,lineColor,list,xData } = this.data.curve //y坐标
    let curveCanvas = wx.createCanvasContext('curveCanvas');
    let lines = wx.createCanvasContext('lines');
    this.drawLines(list, lines);
    this.drawCurve(curveCanvas, curveColText, date, list, xData, lineColor, bgColor);
    },
  // gundong
  scrollCanvas: function (e) {
    console.log(e);
    let index = e.currentTarget.dataset.index
    var canvasLen = e.detail.scrollLeft;
      this.setData({
        indexScroll: index,
        canvasLen: canvasLen
      })
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },

  // 获取坐标
  getZuoBiao(e) {
    let indexs = e.currentTarget.dataset.indexs
    let index = e.target.dataset.index
    let x = e.detail.x
    this.setData({
      tipIndexs: indexs,
      tipIndex: index
    })
    console.log(e)
    let tipHeight =this.data.curve.xData[index].y
    let tipLeft =this.data.curve.xData[index].x
    console.log('x坐标',x)
    console.log(tipHeight)
    this.setData({
      numShiow: true,
      tipLeft:tipLeft-10,
      tipHeight:tipHeight
    })
    let score = this.data.curve.list[index]
    console.log(this.data.curve.list[index])
    console.log(this.data.curve.date[index])
   
    this.setData({
      score: score,
    })
    

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {
   
  },
  //
  // 曲线
  drawCurve(curveCtx, curveColText, curveText, curveData, xData, LineColor, colorEnd) {
    this.drawLineBg(curveCtx); //画横纵坐标框架
    this.drawLineColText(curveColText, curveCtx); //绘制纵坐标文字
    this.drawLineRowText(curveText, curveCtx, xData); //绘制横坐标文字
    this.drawCurveCtx(curveData, curveCtx, xData, LineColor, colorEnd); //绘制曲线
    curveCtx.draw();
  },
  // 阴影
  drawLines(curveData, curveCtx) {
    this.drawCurveCtxs(curveData, curveCtx); //绘制曲线
    curveCtx.draw();
  },
  drawCurveCtx(mData, lineCtx, xData, LineColor, colorEnd) {
    curve.points = [];
    for (let i = 0; i < mData.length; i++) {
      curve.points.push({
        x: 29.5 + i * 52,
        y: 200 - mData[i] / 100 * 150
      });
    }
    this.drawCurvePath(curve.points, lineCtx, LineColor, colorEnd);
    // 获取y轴做线条高度
    curve.points.forEach((v, i) => {
      xData[i].y = v.y
    })
  },
  // 阴影
  drawCurveCtxs(mData, lineCtx) {
    curve.points = [];
    for (let i = 0; i < mData.length; i++) {
      curve.points.push({
        x: 29.5 + i * 52,
        y: 200 - mData[i] / 100 * 150
      });
    }
    this.drawCurvePaths(curve.points, lineCtx);
  },
  // 绘制曲线背景
  drawCurvePath(path, ctx, LineColor, colorEnd) {
    var point = getControlPoint(path);
    ctx.beginPath();
    const grd = ctx.createLinearGradient(174, 180, 200, 0);
    grd.addColorStop(0, '#ffffff');
    grd.addColorStop(0.8, colorEnd);
    grd.addColorStop(1, colorEnd);
    ctx.setFillStyle(grd);
    ctx.setGlobalAlpha(0.8);
    ctx.beginPath();
    ctx.moveTo(29, 200);
    ctx.lineTo(curve.points[0].x, curve.points[0].y);
    var int = 0;
    for (let i = 0; i < curve.points.length; i++) {
      if (i == 0) {
        ctx.quadraticCurveTo(point[0].x, point[0].y, curve.points[1].x, curve.points[1].y);
        int = int + 1;
      } else if (i < curve.points.length - 2) {
        ctx.bezierCurveTo(point[int].x, point[int].y, point[int + 1].x, point[int + 1].y, curve.points[i + 1].x, curve.points[i + 1].y);
        int += 2;
      } else if (i == curve.points.length - 2) {
        ctx.quadraticCurveTo(point[point.length - 1].x, point[point.length - 1].y, curve.points[curve.points.length - 1].x, curve.points[curve.points.length - 1].y);
      }
    }
    ctx.lineTo(curve.points[curve.points.length - 1].x, 200);
    ctx.fill();
    ctx.closePath();
    this.drawCurveSign(point, ctx, LineColor)
  },
  
  // 绘制点加线
  drawCurveSign(point, ctx, LineColor) {
    // 绘制线
    ctx.beginPath();
    ctx.setStrokeStyle(LineColor);
    ctx.setGlobalAlpha(1);
    ctx.setLineWidth(4);
    var int = 0;
    ctx.moveTo(curve.points[0].x - 20, curve.points[0].y);
    for (var i = 0; i < curve.points.length; i++) {
      if (i == 0) {
        ctx.quadraticCurveTo(point[0].x, point[0].y, curve.points[1].x, curve.points[1].y);
        int = int + 1;
      } else if (i < curve.points.length - 2) {
        ctx.bezierCurveTo(point[int].x, point[int].y, point[int + 1].x, point[int + 1].y, curve.points[i + 1].x, curve.points[i + 1].y);
        int += 2;
      } else if (i == curve.points.length - 2) {
        ctx.quadraticCurveTo(point[point.length - 1].x, point[point.length - 1].y, curve.points[curve.points.length - 1].x, curve.points[curve.points.length - 1].y);
      }
    }
    ctx.stroke();
    // 绘制点
    // ctx.beginPath();
    // ctx.setGlobalAlpha(1);
    // for (let i = 0; i < curve.points.length; i++) {
    //   ctx.beginPath();
    //   ctx.arc(curve.points[i].x, curve.points[i].y, 5, 0, 2 * Math.PI);
    //   console.log('点',curve.points[i].x, curve.points[i].y, 5, 0, 2 * Math.PI)
    //   ctx.setFillStyle("#3388FF");
    //   ctx.fill();
    //   ctx.closePath();
    // }
  },
  // 阴影
  // 绘制曲线背景
  drawCurvePaths(path, ctx) {
    var point = getControlPoint(path);
    ctx.beginPath();
    this.drawCurveSigns(point, ctx)
  },
  drawCurveSigns(point, ctx) {
    // 绘制线
    ctx.beginPath();
    ctx.setStrokeStyle("rgba(0,0,0,0.05)");
    // ctx.setStrokeStyle("red");
    ctx.setGlobalAlpha(1);
    ctx.setLineWidth(4);
    var int = 0;
    ctx.moveTo(curve.points[0].x - 20, curve.points[0].y);
    for (var i = 0; i < curve.points.length; i++) {
      if (i == 0) {
        ctx.quadraticCurveTo(point[0].x, point[0].y, curve.points[1].x, curve.points[1].y);
        int = int + 1;
      } else if (i < curve.points.length - 2) {
        ctx.bezierCurveTo(point[int].x, point[int].y, point[int + 1].x, point[int + 1].y, curve.points[i + 1].x, curve.points[i + 1].y);
        int += 2;
      } else if (i == curve.points.length - 2) {
        ctx.quadraticCurveTo(point[point.length - 1].x, point[point.length - 1].y, curve.points[curve.points.length - 1].x, curve.points[curve.points.length - 1].y);
      }
    }
    ctx.stroke();
  },

  // 画横坐标
  drawLineBg(lineCtx) {
    lineCtx.setStrokeStyle("#fff");
    for (let i = 0; i < 6; i++) {
      lineCtx.moveTo(curve.mCenter - 160, 50 + 30 * i);
      lineCtx.lineTo(curve.mCenter + 160, 50 + 30 * i);
      lineCtx.stroke();
    }
  },
  // 绘制横坐标文字
  drawLineRowText(mData, lineCtx, xData) {
    lineCtx.setFillStyle("#333");
    lineCtx.setFontSize(12); //设置字体
    for (let i = 0; i < mData.length; i++) {
      if (mData.length >= 3 && mData[1] != '') {
        lineCtx.fillText(mData[i], 20 + i * 49, 220);
        xData.push({
          tiem: mData[i],
          x: 20 + i * 49,
          y: 0
        })

        // lineCtx.fillText(mData[i][1], 15 + i * 65, 235);
      } else if (mData[1] == '') {
        // 数据小于等于2的时候的坐标
        lineCtx.fillText(mData[i], 60 + i * 90, 220);
        // lineCtx.fillText(mData[i][1], 35 + i * 80, 235);
        xData.push({
          tiem: mData[i],
          x: 20 + i * 49,
          y: 0
        })
      } else if (mData[2] == '') {
        // 数据小于等于1的时候的坐标
        lineCtx.fillText(mData[i], 20 + i * 90, 220);
        // lineCtx.fillText(mData[i][1], 35 + i * 80, 235);
        xData.push({
          tiem: mData[i],
          x: 20 + i * 49,
          y: 0
        })
      }
    }
    // this.setData({
    //   xData: xData
    // })
  },
  // 绘制纵坐标文字
  drawLineColText(mData, lineCtx) {
    lineCtx.beginPath();
    lineCtx.setFillStyle("#fff");
    for (let i = 0; i < 6; i++) {
      lineCtx.fillText(mData[i], 10, 55 + 30 * i);
    }
  },



  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {

  },
  // 日历
  // 日历
  onDayClick: function (event) {
    console.log(event.detail)
    wx.showToast({
      title: '日期被点击，具体信息请看Console信息',
      icon: 'none'
    })
  },
  onRangeComplete: function (event) {
    console.log(event.detail)
    var begin = new Date(event.detail.begin);
    var end = new Date(event.detail.end);
    // + ' ' + d.getHours() + ':' + d.getMinutes() + ':' + d.getSeconds()
    var begintime = begin.getFullYear() + '-' + (begin.getMonth() + 1) + '-' + begin.getDate();
    var endtime = end.getFullYear() + '-' + (end.getMonth() + 1) + '-' + end.getDate();
    console.log(begintime)
    console.log(endtime)
    this.setData({
      beginDate: begintime,
      endDate: endtime
    })
    this.getJieGuo(begintime, endtime)

  },
  onMonthChange: function (event) {
    console.log(event.detail)
    wx.showToast({
      title: '月份变换，具体信息请看Console信息',
      icon: 'none'
    })
  },
})
// quxian
// 折线变曲线
let Vector2 = function (x, y) {
  this.x = x;
  this.y = y;
};
Vector2.prototype = {
  "length": function () {
    return Math.sqrt(this.x * this.x + this.y * this.y);
  },
  "normalize": function () {
    let inv = 1 / this.length() == Infinity ? 0 : 1 / this.length();
    return new Vector2(this.x * inv, this.y * inv);
  },
  "add": function (v) {
    return new Vector2(this.x + v.x, this.y + v.y);
  },
  "multiply": function (f) {
    return new Vector2(this.x * f, this.y * f);
  },
  "dot": function (v) {
    return this.x * v.x + this.y * v.y;
  },
  "angle": function (v) {
    return Math.acos(this.dot(v) / (this.length() * v.length())) * 180 / Math.PI;
  }
};

function getControlPoint(path) {
  let rt = 0.3;
  let count = path.length - 2;
  let arr = [];
  for (let i = 0; i < count; i++) {
    let a = path[i];
    let b = path[i + 1];
    let c = path[i + 2];
    let v1 = new Vector2(a.x - b.x, a.y - b.y);
    let v2 = new Vector2(c.x - b.x, c.y - b.y);
    let v1Len = v1.length();
    let v2Len = v2.length();
    let centerV = v1.normalize().add(v2.normalize()).normalize();
    let ncp1 = new Vector2(centerV.y, centerV.x * -1);
    let ncp2 = new Vector2(centerV.y * -1, centerV.x);
    if (ncp1.angle(v1) < 90) {
      let p1 = ncp1.multiply(v1Len * rt).add(b);
      let p2 = ncp2.multiply(v2Len * rt).add(b);
      arr.push(p1, p2);
    } else {
      let p1 = ncp1.multiply(v2Len * rt).add(b);
      let p2 = ncp2.multiply(v1Len * rt).add(b);
      arr.push(p2, p1);
    }
  }
  return arr;
};

借鉴
完整代码块

weixin_45094203
关注
专栏目录
微信小程序开发中的数据可视化与图表展示
wx_linying1029的博客
08-15 274
你可以根据自己的需求，使用微信小程序自带的图表组件或者第三方图表库，来展示不同类型的图表。你可以根据第三方库的使用文档，调整配置项和数据，实现不同类型的图表展示。你可以根据自己的需求，调整配置项和数据，实现不同类型的图表展示。微信小程序提供了一个基础的图表组件，可以用来展示柱状图、折线图、饼图等常见的图表类型。除了微信小程序自带的图表组件，还有一些第三方的图表库可以帮助我们更丰富地展示数据。在需要展示图表的页面的wxml文件中，添加图表组件。在需要展示图表的页面的wxml文件中，添加图表组件。
canvas画条形图 微信小程序_在微信小程序中绘制图表（part1）
weixin_36328260的博客
12-30 978
微信小程序中图表现状由于微信小程序本身框架的限制，很难集成目前已有的图表工具，显示图表目前有两种方案：1、服务器端渲染图表，输出图片，微信小程序中直接显示渲染好的图片，比如highcharts提供了服务端渲染的能力hightcharts server render，这种方式需要后台有一套渲染服务，并且有一定的网络开销。2、微信小程序API中提供了canvas的支持，利用canvas自行绘制图表。下...
原生微信小程序使用u-charts（组件版）折线图示例
m0_64130892的博客
03-10 5949
之前一直使用的都是 wx-charts，链接：xiaolin3303/wx-charts: 微信小程序图表charts组件 ，但是这个库已经五六年没有维护了。​ 今天来介绍以下 u-charts 的组件版的基本使用。 这篇文章只讲述了折线图的基本使用方法，更多配置项建议阅读官方文档 （链接在文章开头）本文的第四点 进阶用法，是我的踩坑记录：1. 为什么设置了允许滚动，滑动页面没有效果？2.到底怎么获取索引号？为什么官网都是uniapp的演示。
微信小程序 - 曲线图
Anjjiewm的博客
11-26 8143
微信小程序 - 曲线图 最近要做微信小程序，项目中需要曲线图显示数据，所以在网上看了一下找了很久都没有找到一个，不知道是我查找的姿势不对，还是什么的。所以就自己做了一个曲线图，现在分享给大家。 不啰嗦，直接上代码： wxml代码: &lt;canvas canvas-id='curve-img' style='width:{{canvasWidth}}px;height:{{canvasHeig...
小程序 图表js
st646889325的博客
05-24 747
/* * charts for WeChat small app v1.0 * * https://github.com/xiaolin3303/wx-charts * 2016-11-28 * * Designed and built with all the love of Web */ 'use strict'; var config = { yAxisWidth...
微信小程序Canvas绘制曲线图饼图柱状图雷达图蛛网图实现（附源码）
weixin_44904003的博客
04-30 1529
是一个简单、面向对象、为设计者和开发者准备的图表绘制工具库。可以绘制柱状图、热点图、曲线图等，使用小程序中的Canvas画布
微信小程序中使用ECharts，实现折线图、曲线图、柱形图等
weixin_50307964的博客
06-14 4939
根据Echarts官方文档可以看到，Echarts是兼容了微信小程序的；那么我们就可以放心大胆的使用了；找到相对于的代码即可开始开发了
微信小程序利用Echarts组件实现实时动态曲线
Jerry_Han0的博客
09-11 2107
ECharts，一个使用 JavaScript 实现的开源可视化库，可以流畅的运行在 PC 和移动设备上，兼容当前绝大部分浏览器（IE9/10/11，Chrome，Firefox，Safari等），底层依赖矢量图形库 ZRender，提供直观，交互丰富，可高度个性化定制的数据可视化图表。
微信小程序demo：利用canvas绘制折线图
03-15
在这个“微信小程序demo：利用canvas绘制折线图”的项目中，我们将探讨如何利用HTML5的Canvas API在微信小程序环境中创建动态的、交互式的折线图表。 Canvas是一个基于矢量图形的HTML元素，它可以用来在网页上动态...
微信小程序demo：基于canvas的动态柱状图
03-15
总之，这个"微信小程序demo：基于canvas的动态柱状图"项目旨在展示如何在微信小程序环境下集成和使用Canvas进行图形绘制，尤其是数据可视化。通过学习和实践这个项目，你可以掌握在小程序中创建交互式图表的关键技术...
微信小程序绘制图表（折线图、柱状图）
最新发布
04-01
微信小程序绘制图表（折线图、柱状图），制作统计数据，非常直观， 图表组件链接：https://github.com/xiaolin3303/wx-charts/blob/master/dist/wxcharts.js
微信小程序使用二次贝塞尔曲线画波浪
10-17
主要为大家详细介绍了微信小程序使用二次贝塞尔曲线画波浪，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
微信小程序折线图
09-24
微信小程序绘图，仅折线图，注释完整 微信小程序绘图，仅折线图，注释完整 微信小程序绘图，仅折线图，注释完整
Bezier曲线绘制小程序
11-18
Bezier曲线绘制小程序 Bezier曲线绘制小程序
微信小程序canvas画图功能实现
12-26
微信小程序canvas画图功能实现
微信小程序完美的利用canvas做的折线图wechat_Chart-master.zip
09-25
微信小程序完美的利用canvas做的折线图wechat_Chart-master.zip
微信小程序遍历Echarts图表实现多个饼图
10-17
ec-canvas是微信小程序官方提供的Echarts图表适配组件，用于在小程序中绘制Echarts图表。 7. 代码实现细节和逻辑：从wxml文件的结构到js中配置Echarts图表的过程，再到小程序的生命周期钩子函数等，这一系列过程...
微信小程序统计图表之折线图曲线图
u014388322的专栏
09-11 920
本人专注于Android/java/数据库/微信小程序技术领域的开发，以及有好几年的计算机毕业设计方面的实战开发经验和技术积累；尤其是在安卓（Android）的app的开发和微信小程序的开发，很是熟悉和了解；本人也是多年的Android开发人员；希望我发布的此篇文件可以帮助到您；🍅。
微信小程序简单的三次贝塞尔绘制坐标曲线图
FWJJJ的博客
08-10 391
【代码】微信小程序简单的三次贝塞尔绘制坐标曲线图。
微信小程序canvas实现刮刮乐详细教程
"微信小程序canvas实现刮刮乐效果" 在微信小程序中实现刮刮乐效果，主要是利用HTML5的canvas元素及其API。以下是一份详细的知识点解析： 1. **微信小程序环境**： 微信小程序是腾讯推出的一种轻量级的应用开发...
评论 3
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值