Vue+Openlayer使用draw实现绘制点线面功能

已于 2024-07-13 23:45:33 修改
阅读量2.8k 收藏 17
点赞数 4
分类专栏： openlayers 文章标签： vue.js css javascript
于 2021-08-19 17:55:23 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_40323256/article/details/119807866
版权

目录

基本效果

可以手绘

import { Draw } from "ol/interaction";

    //绘制线要素
    drawFeature() {
      this.draw = new Draw({
        source: this.lineStringLayer.getSource(),
        type: "LineString", //Point,LineString,Polygon,Circle
      });
      this.map.addInteraction(this.draw);
    },

完整代码： 

<template>
  <div id="map" style="height: 100vh; width: 100vw"></div>
</template>
 
<script>
import "ol/ol.css";
import { Map, View } from "ol";
import { OSM, Vector as VectorSource } from "ol/source";
import { Vector as VectorLayer, Tile as TileLayer } from "ol/layer";
import { Draw } from "ol/interaction";
import { Fill, Stroke, Style, Text, Circle } from "ol/style";
export default {
  data() {
    return {
      map: {},
      vectorLayer: {},
      draw: {},
    };
  },
  created() {},
  mounted() {
    this.initMap();
    this.addLayer();
    this.drawFeature();
  },
  computed: {},
  methods: {
    initMap() {
      this.map = new Map({
        target: "map",
        layers: [
          new TileLayer({
            source: new OSM(),
          }),
        ],
        view: new View({
          projection: "EPSG:4326",
          center: [104.2979180563, 30.528298024],
          zoom: 18,
        }),
      });
    },
    addLayer() {
      this.vectorLayer = new VectorLayer({
        source: new VectorSource(),
      });
      this.map.addLayer(this.vectorLayer);
    },
    //绘制线要素核心代码
    drawFeature() {
      this.draw = new Draw({
        source: this.vectorLayer.getSource(),
        type: "LineString", //Point,LineString,Polygon,Circle
      });
      this.map.addInteraction(this.draw);
    },
  },
};
</script>

基本效果

实现代码：

<template>
  <div id="map" style="height: 100vh; width: 100vw">
    <div style="position: fixed; top: 150px; left: 10px; z-index: 999">
      <el-button @click="drawFeature('Point')">画点</el-button>
      <el-button @click="drawFeature('LineString')">画线</el-button>
      <el-button @click="drawFeature('Polygon')">画面</el-button>
      <el-button @click="drawFeature('Circle')">画圆</el-button>
      <el-button @click="draw.removeLastPoint()">撤回</el-button>
      <el-button @click="map.removeInteraction(draw)">取消</el-button>
      <el-button @click="clearDrawLayer()">清除</el-button>
    </div>
  </div>
</template>
<script>
import "ol/ol.css";
import Map from "ol/Map";
import View from "ol/View";
import TileLayer from "ol/layer/Tile";
import { Vector as VectorLayer } from "ol/layer";
import { OSM, Vector as VectorSource } from "ol/source";
import Draw from "ol/interaction/Draw";
import { Fill, Stroke, Style, Text, Circle } from "ol/style";

export default {
  name: "",
  data() {
    return {
      map: {},
      draw_source: new VectorSource(),
      draw_vector: {},
      draw: {},
    };
  },
  mounted() {
    this.initMap();
    this.addDrawLayer();
  },
  methods: {
    //添加绘制点线面图层
    addDrawLayer() {
      this.draw_vector = new VectorLayer({
        source: this.draw_source,
        //绘制好后，在地图上呈现的样式
        style: new Style({
          fill: new Fill({
            color: "rgba(255, 255, 255, 0.2)",
          }),
          stroke: new Stroke({
            //边界样式
            color: "#ffcc33",
            width: 3,
          }),
          //点样式继承image
          image: new Circle({
            radius: 7,
            fill: new Fill({
              color: "#ffcc33",
            }),
          }),
        }),
      });
      this.map.addLayer(this.draw_vector);
    },
    //清除绘制图层
    clearDrawLayer() {
      this.map.removeInteraction(this.draw); //移除交互
      this.draw_vector.getSource().clear(); //清除图层上的所有要素
    },
    //绘制点线面
    drawFeature(featureType = "") {
      this.map.removeInteraction(this.draw);

      this.draw = new Draw({
        source: this.draw_source,
        type: featureType,
        //绘制时，在地图上呈现的样式
        style: new Style({
          fill: new Fill({
            color: "rgba(255, 255, 255, 0.2)",
          }),
          stroke: new Stroke({
            color: "#ffcc33",
            width: 2,
          }),
          image: new Circle({
            radius: 7,
            fill: new Fill({
              color: "#ffcc33",
            }),
          }),
        }),
      });
      this.map.addInteraction(this.draw);
    },
    // 初始化地图
    initMap() {
      this.map = new Map({
        target: "map",
        layers: [
          new TileLayer({
            source: new OSM(),
            visible: true,
            name: "OSM",
          }),
        ],
        view: new View({
          projection: "EPSG:4326",
          center: [115, 39],
          zoom: 4,
        }),
      });
    },
  },
};
</script>

注意：绘制完后，可以通过e.feature.getGeometry().getCoordinates()获取到绘制的范围的经纬度坐标数组 。如下：

      this.draw.on("drawend", function (e) {
        console.log(" e:", e);
        console.log(" e.feature:", e.feature);
        console.log(" e.feature.getGeometry():", e.feature.getGeometry());
        console.log(
          " e.feature.getGeometry().getCoordinates():",
          e.feature.getGeometry().getCoordinates()
        );
      });

在线预览：

WebGIS之家 | 绘制要素 (webgishome.com)icon-default.png?t=N7T8https://www.webgishome.com/preview?id=58&example_name=drawFeature&title=%E7%BB%98%E5%88%B6%E8%A6%81%E7%B4%A0

js封装绘制功能：

DrawTool.js:


import "ol/ol.css";
import Map from "ol/Map";
import View from "ol/View";
import TileLayer from "ol/layer/Tile";
import { Vector as VectorLayer } from "ol/layer";
import { OSM, Vector as VectorSource, XYZ } from "ol/source";
import Draw from "ol/interaction/Draw";
import { Fill, Stroke, Style, Text, Icon, Circle } from "ol/style";

export default class DrawTool {
    constructor({ domId_map }) {
        this.domId_map = domId_map
        this.map = null
        this.draw_source = new VectorSource()
        this.draw_vector = null
        this.draw = null
    }
    initMap() {
        this.map = new Map({
            target: this.domId_map,
            layers: [
                new TileLayer({
                    source: new XYZ({
                        url:
                            "http://t3.tianditu.com/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=5a257cd2df1b3311723bd77b0de14baf",
                    }),
                    visible: true,
                    // name: "OSM",
                }),
            ],
            view: new View({
                projection: "EPSG:4326",
                center: [115, 39],
                zoom: 4,
            }),
        })

        this.addDrawLayer()
    }
    //添加绘制点线面图层
    addDrawLayer() {
        this.draw_vector = new VectorLayer({
            source: this.draw_source,
            //绘制好后，在地图上呈现的样式
            style: new Style({
                fill: new Fill({
                    color: "rgba(255, 255, 255, 0.2)",
                }),
                stroke: new Stroke({
                    //边界样式
                    color: "#ffcc33",
                    width: 3,
                }),
                //点样式继承image
                image: new Circle({
                    radius: 7,
                    fill: new Fill({
                        color: "#ffcc33",
                    }),
                }),
            }),
        });
        this.map.addLayer(this.draw_vector);
    }
    //清除绘制图层
    clearDrawLayer() {
        this.map.removeInteraction(this.draw); //移除交互
        // this.draw_vector.getSource().clear(); //清除图层上的所有要素
        this.draw_source.clear(); //清除图层上的所有要素
    }
    // 撤回操作
    removeLastPoint() {
        this.draw.removeLastPoint()
    }
    // 取消绘制
    cancelDraw() {
        this.map.removeInteraction(this.draw); //移除交互
    }
    //绘制点线面
    drawFeature(featureType = "") {
        if (this.draw) {
            this.map.removeInteraction(this.draw);
        }

        this.draw = new Draw({
            source: this.draw_source,
            type: featureType,
            //绘制时，在地图上呈现的样式
            style: new Style({
                fill: new Fill({
                    color: "rgba(255, 255, 255, 0.2)",
                }),
                stroke: new Stroke({
                    color: "#ffcc33",
                    width: 2,
                }),
                image: new Circle({
                    radius: 7,
                    fill: new Fill({
                        color: "#ffcc33",
                    }),
                }),
            }),
        });
        this.map.addInteraction(this.draw);
    }
}

 测试：

<template>
    <div class="main">
        <div id="olContainer" style="height: 100vh; width: 100vw"></div>
        <div style="position: fixed; top: 150px; left: 10px; z-index: 999">
            <el-button @click="state.draw.drawFeature('Point')">画点</el-button>
            <el-button @click="state.draw.drawFeature('LineString')">画线</el-button>
            <el-button @click="state.draw.drawFeature('Polygon')">画面</el-button>
            <el-button @click="state.draw.drawFeature('Circle')">画圆</el-button>
            <el-button @click="state.draw.removeLastPoint()">撤回</el-button>
            <el-button @click="state.draw.cancelDraw()">取消</el-button>
            <el-button @click="state.draw.clearDrawLayer()">清除</el-button>
        </div>
    </div>

</template>
  
<script setup>
import { reactive } from 'vue';
import DrawTool from './DrawTool'
const state = reactive({
    draw: null
})
onMounted(() => {
    let draw = new DrawTool({ domId_map: 'olContainer' })
    draw.initMap()

    state.draw = draw
    console.log("state:", state)
})
</script>
<style lang="scss" scoped>
.main {
    position: relative;
    height: 100vh;
    width: 100vw;

    #olContainer {
        position: absolute;
        height: 100vh;
        width: 100vw;
    }

}
</style>

可以手绘

效果图

使用代码：

<template>
  <div style="height: 100vh; width: 100vw">
    <div id="map" style="height: 100%; width: 100%"></div>
    <div style="position: fixed; top: 150px; left: 490px; z-index: 999">
      <LjDraw :map="map"></LjDraw>
    </div>
  </div>
</template>
<script>
import "ol/ol.css";
import Map from "ol/Map";
import View from "ol/View";
import TileLayer from "ol/layer/Tile";
import { Vector as VectorLayer } from "ol/layer";
import { OSM, Vector as VectorSource } from "ol/source";
import Draw from "ol/interaction/Draw";
import { Fill, Stroke, Style, Text, Circle } from "ol/style";
import LjDraw from "@/components/LjDraw/index.vue";
export default {
  name: "",
  components: { LjDraw },
  data() {
    return {
      map: {},
    };
  },

  beforeMount() {
    // _isMounted是当前实例mouned()是否执行 此时为false
    window.parentMounted = this._isMounted;
  },
  mounted() {
    //父组件中初始化地图对象map
    this.initMap();
    // _isMounted是当前实例mouned()是否执行 此时为true
    window.parentMounted = this._isMounted;
  },
  methods: {
    // 初始化地图
    initMap() {
      this.map = new Map({
        target: "map",
        layers: [
          new TileLayer({
            source: new OSM(),
            visible: true,
            name: "OSM",
          }),
        ],
        view: new View({
          projection: "EPSG:4326",
          center: [115, 39],
          zoom: 4,
        }),
      });
    },
  },
  watch: {},
};
</script>

 LjDraw 组件代码：

<!--LjDraw-->
<template>
  <div>
    <el-button size="mini">
      <select
        v-model="currentDrawFeature"
        style="
          background-color: rgb(66, 66, 66);
          color: white;
          padding: 2px 7px;
          outline: none;
        "
        @change="drawFeature()"
      >
        <option value="">请选择</option>
        <option value="Point" label="画点"></option>
        <option value="LineString">画线</option>
        <option value="Polygon">画面</option>
        <option value="Circle">画圆</option>
      </select>
    </el-button>

    <el-button size="mini"
      ><el-checkbox v-model="enableFreeHand">手绘</el-checkbox></el-button
    >
    <el-button size="mini" @click="draw.removeLastPoint()">撤回</el-button>
    <el-button size="mini" @click="cancelDraw()">取消</el-button>
    <el-button size="mini" @click="clearDrawLayer()">清除</el-button>
  </div>
</template>
<script>
import "ol/ol.css";
import Map from "ol/Map";
import View from "ol/View";
import TileLayer from "ol/layer/Tile";
import { Vector as VectorLayer } from "ol/layer";
import { OSM, Vector as VectorSource } from "ol/source";
import Draw from "ol/interaction/Draw";
import { Fill, Stroke, Style, Text, Icon, Circle } from "ol/style";

export default {
  name: "LjDraw",
  props: {
    map: {
      default: {},
      required: true,
    },
  },
  data() {
    return {
      draw_source: new VectorSource(),
      draw_vector: {},
      draw: {},
      currentDrawFeature: "", //当前正在绘制的要素类型
      enableFreeHand: false, //是否允许手绘
    };
  },
  mounted() {
    let pMountedTimer = {}; //定时器
    pMountedTimer = setInterval(() => {
      if (window.parentMounted) {
        //在这里执行初始化
        this.addDrawLayer();

        clearInterval(pMountedTimer); //清除定时器
      }
    }, 1000);
  },
  methods: {
    //添加绘制点线面图层
    addDrawLayer() {
      this.draw_vector = new VectorLayer({
        source: this.draw_source,
        //绘制好后，在地图上呈现的样式
        style: new Style({
          fill: new Fill({
            color: "rgba(255, 255, 255, 0.2)",
          }),
          stroke: new Stroke({
            //边界样式
            color: "#ffcc33",
            width: 3,
          }),
          //点样式继承image
          image: new Circle({
            radius: 7,
            fill: new Fill({
              color: "#ffcc33",
            }),
          }),
        }),
        zIndex: 9999,
      });
      this.map.addLayer(this.draw_vector);
    },
    //取消绘制
    cancelDraw() {
      this.map.removeInteraction(this.draw); //移除交互
      this.currentDrawFeature = ""; //取消选中要素！！
    },
    //清空绘制图层
    clearDrawLayer() {
      this.map.removeInteraction(this.draw); //移除交互
      this.draw_vector.getSource().clear(); //清除图层上的所有要素
      this.currentDrawFeature = ""; //取消选中要素！！
    },
    //绘制点线面
    drawFeature() {
      this.map.removeInteraction(this.draw); //移除交互

      if (!this.currentDrawFeature) return; //这里一定要判断

      this.draw = new Draw({
        source: this.draw_source,
        type: this.currentDrawFeature,
        //绘制时，在地图上呈现的样式
        style: new Style({
          fill: new Fill({
            color: "rgba(255, 255, 255, 0.2)",
          }),
          stroke: new Stroke({
            color: "#ffcc33",
            width: 2,
          }),
          image: new Circle({
            radius: 7,
            fill: new Fill({
              color: "#ffcc33",
            }),
          }),
        }),
        freehand: this.enableFreeHand, //手绘
      });
      this.map.addInteraction(this.draw);
    },
    // 初始化地图
    initMap() {
      this.map = new Map({
        target: "map",
        layers: [
          new TileLayer({
            source: new OSM(),
            visible: true,
            name: "OSM",
          }),
        ],
        view: new View({
          projection: "EPSG:4326",
          center: [115, 39],
          zoom: 4,
        }),
      });
    },
  },
  watch: {
    enableFreeHand: {
      handler() {
        this.drawFeature();
      },
    },
  },
};
</script>

疆~
关注
  • 4
    点赞
  • 踩
  • 17
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
Vue+OpenLayers7入门到实战：OpenLayers图形绘制功能，OpenLayers实现在地图上绘制线段、圆形和多边形
GIS地图技术分享(GIS入门、Openlayers教程、Leaflet教程)，做最好的GIS地图开发教程
03-26 303
本章介绍如何使用OpenLayers7在地图上实现图形绘制功能，OpenLayers地图实现在地图上绘制线段、圆形和多边形等基本图形。注意：本章需要用到Element-UI组件，可能需要额外安装依赖，这里跳过不详述，具体可参考Element-UI官方文档。
vue3+vite+openlayers6实现绘制扇形及环形组件代码
08-05
在手写openlayers6 绘制扇形及环形源码的过程中会摘取openlayers中的核心逻辑，简化代码实现过程，保留核心功能，例如：vue3接入openlayers openlayers绘制环形 openlayers绘制扇形 适合人群：具备一定编程基础，...
8. OpenLayers 绘画元素，画点、画线、画面、画圆（结合Vue 详细教程）
全栈三维GIS开发工程师，擅长Cesium、OpenLayers、Three.js、WebGL、Vue、Django、GDAL和QGIS技术。在这个博客里，我将分享我的开发经验、技术心得和项目案例，希望能为GIS爱好者和开发者提供有价值的参考。
07-01 5004
本文介绍了如何在Vue中使用OpenLayers库来实现鼠标绘制点、线、面、圆的功能，并提供清空绘画和退出绘制模式的操作。首先，我们需要创建一个地图容器，并添加底图和矢量图层。底图使用了ArcGIS World Street Map，矢量图层用于显示用户的绘制结果。然后，我们通过添加Draw交互控件来实现绘制功能。每个绘制按钮都有一个点击事件处理函数，调用addInteraction方法来添加相应类型的绘制控件。最后，我们提供了清空绘制和退出绘制模式的操作。
openlayers绘制一个线段
最新发布
qq_45089709的博客
06-05 196
【代码】openlayers绘制一个线段。
Vue+Openlayer中测距测面和绘制点线面组件-LjMeasureDraw4326和LjMeasureDraw3857
08-23 1227
效果图： 首先下载turf.js: cnpm i -S @turf/turf 全局引入turf.js //引入turf.js import * as turf from '@turf/turf' Vue.prototype.$turf = turf 实现代码： <template> <div id="map" style="height: 100vh; width: 100vw"> <div style="position: fixed; ..
在vue中使用OpenLayers地图 02 绘制点线面等图形
不染-9732
02-21 2119
openLayers地图绘制多边形
Vue+Openlayers+Draw实现画笔切换功能，切换画笔为点、线、面
BADAO_LIUMANG_QIZHI的博客
04-01 2353
场景 Vue+Openlayer使用Draw实现交互式绘制线段： Vue+Openlayer使用Draw实现交互式绘制线段_霸道流氓气质的博客-CSDN博客 Vue+Openlayer使用Draw实现交互式绘制多边形并获取面积: Vue+Openlayer使用Draw实现交互式绘制多边形并获取面积_霸道流氓气质的博客-CSDN博客 如果需要将绘制点、线、面集成在一个页面中并且可以实现切换画笔样式。 注： 博客：霸道流氓气质的博客_CSDN博客-C#,架构之路,SpringBoot.
openlayers绘制自定义点线面样式,带清除功能Vue版
qq_39804689的博客
05-20 6592
openlayers绘制自定义点线面样式,带清除功能 初学openlayers 有不足之处还望轻喷,多谢 项目用的是vue,elementUI,以及scss 啊…本来点线面都录制了一个gif图,因为某些原因 只剩下一个线的了,将就看着吧 在画线和面的时候,双击地图为停止绘制,也可以通过切换绘制属性手动停止绘制,具体内容注释里有 <template> <div id="ma...
Vue+Openlayers实现绘制线段并测量距离显示
BADAO_LIUMANG_QIZHI的博客
12-30 3020
场景 Vue+Openlayer使用Draw实现交互式绘制线段： Vue+Openlayer使用Draw实现交互式绘制线段_BADAO_LIUMANG_QIZHI的博客-CSDN博客_vue 线段 在上面已经实现交互式绘制线段基础上，怎样实现测量距离。 注： 博客：BADAO_LIUMANG_QIZHI的博客_霸道流氓气质_CSDN博客-C#,SpringBoot,架构之路领域博主 关注公众号 霸道的程序猿 获取编程相关电子书、教程推送与免费下载。 实现 1、页面上添加按钮与map
vue+ol实现 ol 地图加载geojson
bitree1的博客
05-12 9286
一、背景 公司需要个简单的二维底图，加载点线面数据，为了省时间就用openlayers框架写一个简单的加载方法，openlayers核心包含Map对象、View视图、Layer图层、Source来源、Feature等特征 二、加载配置 三、地图初始化 import esb from '@/plugins/esb' import 'ol/ol.css' import Map from 'ol/Map' import View from 'ol/View' import { getWidth,getC
Vue+ElementUI使用vue-pdf实现预览功能
10-15
主要为大家详细介绍了Vue+ElementUI使用vue-pdf实现预览功能，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
springboot + xterm.js + vue + websocket实现终端功能
12-08
1、前端框架：Vue + element-ui 2、后端框架：SpringBoot + Mybatis 3、数据库：H2 4、其他第三方工具或者插件： Jsch：用于远程连接ECS服务器。 Websocket：与前端进行实时交互。 xterm：渲染web版本的terminal终端...
vue+element+Java实现批量删除功能
10-17
主要介绍了vue+element+Java实现批量删除功能,代码简单易懂，非常不错，具有一定的参考借鉴价值，需要的朋友可以参考下
vue+springboot前后端分离实现单点登录跨域问题解决方法
08-28
Vue+SpringBoot前后端分离实现单点登录跨域问题解决方法 单点登录概述 单点登录（Single Sign-On，SSO）是指用户只需登录一次，即可访问所有相关的应用系统，而不需要在每个系统中重复登录。这种机制可以提高用户...
geoserver发布TIF格式瓦片地图
热门推荐
09-07 1万+
一，准备tif地图 可以通过全能电子地图下载器获取地图（软件可以去淘宝下载） 二，geoserver发布tif 在geoserver安装文件夹中双击“startup.bat”打开服务（注意：为了防止端口占用，我这里更改了默认的端口为8090，在startup.bat文件的最后一行中可以看到） 然后访问：http://localhost:8090/geoserver 新建工作区，名为test 新建数据存储 发布图层 切片 可以看到当前文件夹中就有切片文件了
openlayer中加载geojson的几种方式
08-05 1万+
首先： importGeoJSONfrom"ol/format/GeoJSON"; import VectorSource from "ol/layer/Vector" 一，本地geojson文件 new VectorSource({ features:new GeoJSON().readFeatures(this.geojsonData) }) 二，public中的文件 new VectorSource({ url: "sichuan_shp.json", ....
Vue+Openlayer实现轨迹路线
08-27 1万+
<template> <div> <div id="map" ref="map" style="width: 100vw; height: 100vh"></div> </div> </template> <script> import VectorLayer from "ol/layer/Vector"; import VectorSource from "ol/source/Vector"; im...
openlayer中控制图层的显示和隐藏
09-14 9944
一种是通过Layer.setVisible(true)的方式让图层显示或隐藏，这种方式只是让图层中CSS的visible属性改为了false，其dom依然存在于页面中； 另一种方式是让map移除图层，即map.removeLayer(Layer)，这种方式会消除图层dom 代码实现： <el-checkbox-group v-model="checkList_baseMap"> <div> <el-checkbox label="lay
vue+openlayer实现轨迹路线3857
05-01
Vue开发框架与OpenLayers开源地图框架可以很好地结合，用于实现3857轨迹路线。要实现这个功能，可以遵循如下步骤： 1. 安装并导入Vue和OpenLayers相关库文件。 2. 准备地图底图，以及需要展示的轨迹数据，并通过Vue组件进行渲染。 3. 创建一个OpenLayers Map对象，并将其加入Vue实例中。在Map对象中，可以定义地图的中心点、缩放级别等参数，以及显示范围。 4. 创建一个OpenLayers Layer对象，并将其加入Map中。Layer对象可以用于管理和展示地图图层。 5. 创建一个OpenLayers Vector Layer对象，用于展示轨迹数据。在Vector Layer对象中，可以定义轨迹的样式、箭头指示等参数，以及数据的坐标系。 6. 将轨迹数据加入Vector Layer对象中，并执行绘制操作。可以通过OpenLayers提供的绘制工具，获取鼠标与地图交互的绘制事件，实现用户绘制轨迹的功能。 7. 如需展示轨迹的动画效果，可以使用OpenLayers提供的一些动画库（如Tween.js），根据轨迹坐标数据对轨迹进行移动和旋转等操作，从而实现轨迹的动态效果。 总之，Vue开发框架较为灵活，可以与各种地图框架及其相关库文件相结合，进行二次开发和扩展，从而实现各种地图应用及可视化效果。
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值