Leaflet 和 Cesium 加载纠偏后高德地图在线瓦片,高德地图最新最全在线瓦片地址

高德地图地址

高德地图在线瓦片有两个访问地址。

//wprd0{s}.is.autonavi.com/appmaptile?x={x}&y={y}&z={z}&{p} /*访问地址1*/
//webst{s}.is.autonavi.com/appmaptile?x={x}&y={y}&z={z}&{p} /*访问地址2*/

高德地图采用 GCJ02 火星坐标系,叠加到 Leaflet 和 Cesium 默认的 WGS84 通用坐标系需要进行纠偏。

相关参数:

  • {s} 是可用的子域之一,用于克服浏览器对每个主机的并发请求数的限制,支持 1234。
  • {x} 是 WMTS 切片方案中的图块 X 坐标,其中 0 是最西端的图块。
  • {y} 是 WMTS 切片方案中的图块 Y 坐标,其中 0 是最北端的图块。
  • {z} 是 WMTS 切片方案中切片的级别,零级是四叉树金字塔的根。
  • {p} 是以下加载代码中封装的自定义请求参数 param,具体参见下表和代码,下表内容在测试中得出,欢迎指正和补充。
{p}(代码中 param 参数)对应图层瓦片级别
lang=zh_cn&style=6&ltype=0&scl=0&size=0影像底图[1,18]
lang=zh_cn&style=8&ltype=0&scl=0&size=0影像标注,路网 + 注记[1,18]
lang=zh_cn&style=8&ltype=2&scl=0&size=0影像标注,路网[1,18]
lang=zh_cn&style=8&ltype=4&scl=0&size=0影像标注,注记[1,18]
lang=zh_cn&style=7&ltype=0&scl=0&size=0电子地图,区域面 + 路网 + 注记 + 楼块[1,18]
lang=zh_cn&style=7&ltype=1&scl=0&size=0电子底图,区域面[1,18]
lang=zh_cn&style=7&ltype=2&scl=0&size=0电子标注,路网[1,18]
lang=zh_cn&style=7&ltype=3&scl=0&size=0电子底图,区域面 + 路网[1,18]
lang=zh_cn&style=7&ltype=4&scl=0&size=0电子标注,注记[1,18]
lang=zh_cn&style=7&ltype=5&scl=0&size=0电子底图,区域面 + 注记[1,18]
lang=zh_cn&style=7&ltype=6&scl=0&size=0电子标注,路网 + 注记[1,18]
lang=zh_cn&style=7&ltype=7&scl=0&size=0电子底图,区域面 + 路网 + 注记[1,18]
lang=zh_cn&style=7&ltype=8&scl=0&size=0电子底图,楼块[1,18]
lang=zh_cn&style=7&ltype=0&scl=2&size=0电子底图,区域面 + 路网 + 楼块[1,18]
style=7&ltype=0&scl=0&size=0旧版电子地图,中文标注[1,18]
lang=zh_en&style=7&ltype=0&scl=0&size=0旧版电子地图,英文标注[1,18]

Leaflet 添加代码

在线运行

<!DOCTYPE html>
<html>
  <head>
    <title></title>
    <meta charset="utf-8">
    <style type="text/css">
      body { padding: 0; margin: 0; }
      html, body, #map { height: 100%; }
      #param-test { position: absolute; z-index: 999; left: 10px; top: 10px; background: white; padding: 0 3px; line-height: 28px; font-size: 14px }
      #url-input {  width: 450px; height: 18px; margin-bottom: 3px; }
    </style>
    <link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.2/dist/leaflet.css" />
    <script src="https://unpkg.com/leaflet@1.9.2/dist/leaflet.js"></script>
    <script src="https://unpkg.com/gcoord@0.3.2/dist/gcoord.js"></script>
  </head>
  <body>
    <div id="param-test">
      测试参数:<input id="url-input" type="text" placeholder="输入地址参数, 例:style=6&lang=zh_cn&ltype=0&scl=0&size=0, 并回车" onkeydown="loadTile(this.value)" />
    </div>
    <div id="map" />
  </body>
  <script type="text/javascript">
    L.TileLayer.GaoDeTileLayer = L.TileLayer.extend({
      initialize: function (param, options) {
        var templateUrl = "//wprd0{s}.is.autonavi.com/appmaptile?x={x}&y={y}&z={z}&{p}"
        // var templateUrl = "//webst{s}.is.autonavi.com/appmaptile?x={x}&y={y}&z={z}&{p}"
        options = L.extend({ p: param, subdomains: "1234", minZoom: 0, maxZoom: 23, minNativeZoom: 1, maxNativeZoom: 18 }, options)
        L.TileLayer.prototype.initialize.call(this, templateUrl, options)
      },
      _setZoomTransform: function (level, center, zoom) {
        center = L.latLng(gcoord.transform([center.lng, center.lat], gcoord.WGS84, gcoord.GCJ02).reverse()) // 采用 gcoord 库进行纠偏
        L.TileLayer.prototype._setZoomTransform.call(this, level, center, zoom)
      },
      _getTiledPixelBounds: function (center) {
        center = L.latLng(gcoord.transform([center.lng, center.lat], gcoord.WGS84, gcoord.GCJ02).reverse()) // 采用 gcoord 库进行纠偏
        return L.TileLayer.prototype._getTiledPixelBounds.call(this, center)
      },
    })
    L.tileLayer.gaoDeTileLayer = function (param, options) { return new L.TileLayer.GaoDeTileLayer(param, options) }

    var c6000_Layer = L.tileLayer.gaoDeTileLayer("lang=zh_cn&style=6&ltype=0&scl=0&size=0"), // 影像底图
      c8000_Layer = L.tileLayer.gaoDeTileLayer("lang=zh_cn&style=8&ltype=0&scl=0&size=0"), // 影像标注,路网 + 注记
      c8200_Layer = L.tileLayer.gaoDeTileLayer("lang=zh_cn&style=8&ltype=2&scl=0&size=0"), // 影像标注,路网
      c8400_Layer = L.tileLayer.gaoDeTileLayer("lang=zh_cn&style=8&ltype=4&scl=0&size=0"), // 影像标注,注记
      c7000_Layer = L.tileLayer.gaoDeTileLayer("lang=zh_cn&style=7&ltype=0&scl=0&size=0"), // 电子地图,区域面 + 路网 + 注记 + 楼块
      c7100_Layer = L.tileLayer.gaoDeTileLayer("lang=zh_cn&style=7&ltype=1&scl=0&size=0"), // 电子底图,区域面
      c7200_Layer = L.tileLayer.gaoDeTileLayer("lang=zh_cn&style=7&ltype=2&scl=0&size=0"), // 电子标注,路网
      c7300_Layer = L.tileLayer.gaoDeTileLayer("lang=zh_cn&style=7&ltype=3&scl=0&size=0"), // 电子底图,区域面 + 路网
      c7400_Layer = L.tileLayer.gaoDeTileLayer("lang=zh_cn&style=7&ltype=4&scl=0&size=0"), // 电子标注,注记
      c7500_Layer = L.tileLayer.gaoDeTileLayer("lang=zh_cn&style=7&ltype=5&scl=0&size=0"), // 电子底图,区域面 + 注记
      c7600_Layer = L.tileLayer.gaoDeTileLayer("lang=zh_cn&style=7&ltype=6&scl=0&size=0"), // 电子标注,路网 + 注记
      c7700_Layer = L.tileLayer.gaoDeTileLayer("lang=zh_cn&style=7&ltype=7&scl=0&size=0"), // 电子底图,区域面 + 路网 + 注记
      c7800_Layer = L.tileLayer.gaoDeTileLayer("lang=zh_cn&style=7&ltype=8&scl=0&size=0"), // 电子底图,楼块
      c7020_Layer = L.tileLayer.gaoDeTileLayer("lang=zh_cn&style=7&ltype=0&scl=2&size=0") // 电子底图,区域面 + 路网 + 楼块
    var n7000_Layer = L.tileLayer.gaoDeTileLayer("style=7&ltype=0&scl=0&size=0"), // 旧版电子地图,中文标注
      e0000_Layer = L.tileLayer.gaoDeTileLayer("lang=zh_en&style=7&ltype=0&scl=0&size=0") // 旧版电子地图,英文标注

    var map = L.map("map", { center: [29.708050, 118.321499], zoom: 15, zoomControl: false, attributionControl: false, doubleClickZoom: false })
    var overlayLayers = {
      "影像底图": c6000_Layer, "影像标注,路网 + 注记": c8000_Layer, "影像标注,路网": c8200_Layer, "影像标注,注记": c8400_Layer,
      "电子地图,区域面 + 路网 + 注记 + 楼块": c7000_Layer, "电子底图,区域面": c7100_Layer, "电子标注,路网": c7200_Layer, "电子底图,区域面 + 路网": c7300_Layer, "电子标注,注记": c7400_Layer, 
      "电子底图,区域面 + 注记": c7500_Layer, "电子标注,路网 + 注记": c7600_Layer, "电子底图,区域面 + 路网 + 注记": c7700_Layer, "电子底图,楼块": c7800_Layer, "电子底图,区域面 + 路网 + 楼块": c7020_Layer,
      "旧版电子地图,中文标注": n7000_Layer, "旧版电子地图,英文标注": e0000_Layer
    }
    L.control.layers([], overlayLayers, { autoZIndex: false }).addTo(map)
    L.marker([29.708050, 118.321499]).addTo(map) // 添加点用于纠偏测试
    // map.on('dblclick', function (e) { console.dir(e.latlng.lng + "," + e.latlng.lat) })
    
    var test_Layer = null
    function loadTile (param) {
      if (!window.event || window.event.keyCode === 13) { // keyCode ===13 表示按下回车
        if (test_Layer !== null) {
          map.removeLayer(test_Layer)
          test_Layer = null
        }
        if (!param) return
        test_Layer = L.tileLayer.gaoDeTileLayer(param)
        map.addLayer(test_Layer)
      }
    }
    var param = "lang=zh_cn&style=6&ltype=0&scl=0&size=0"
    document.getElementById("url-input").value = param
    loadTile(param)
  </script>
</html>

Cesium 添加代码

在线运行

<!DOCTYPE html>
<html>
  <head>
    <title></title>
    <meta charset="utf-8" />
    <style type="text/css">
      body { padding: 0; margin: 0; }
      html, body, #map { height: 100%; }
      #param-test { position: absolute; z-index: 999; left: 10px; top: 10px; background: white; padding: 0 3px; line-height: 28px; font-size: 14px }
      #url-input {  width: 450px; height: 18px; margin-bottom: 3px; }
      .cesium-viewer .cesium-viewer-bottom { display: none; }
      .cesium-viewer .cesium-baseLayerPicker-item { display: block; width: auto; margin: 3px 10px; }
      .cesium-viewer .cesium-baseLayerPicker-itemIcon, .cesium-viewer .cesium-baseLayerPicker-sectionTitle { display: none; }
      .cesium-viewer .cesium-baseLayerPicker-itemLabel { text-align: left; }
      .cesium-viewer .cesium-baseLayerPicker-dropDown { width: 250px; padding: 0; margin: 0; }
      .cesium-viewer .cesium-baseLayerPicker-choices { border: none; }
      .cesium-viewer .cesium-baseLayerPicker-selectedItem .cesium-baseLayerPicker-itemLabel { color: #00cbff; }
    </style>
    <link rel="stylesheet" href="https://unpkg.com/cesium@1.98.1/Build/Cesium/Widgets/widgets.css" />
    <script src="https://unpkg.com/cesium@1.98.1/Build/Cesium/Cesium.js"></script>
    <script src="https://unpkg.com/gcoord@0.3.2/dist/gcoord.js"></script>
  </head>
  <body>
    <div id="param-test">
      测试参数:<input id="url-input" type="text" placeholder="输入地址参数, 例:style=6&lang=zh_cn&ltype=0&scl=0&size=0, 并回车" onkeydown="loadTile(this.value)" />
    </div>
    <div id="map" />
  </body>
  <script type="text/javascript">
    class GaoDeMercatorProjection extends Cesium.WebMercatorProjection {
      project (cartographic, result) {
        const correct = gcoord.transform([Cesium.Math.toDegrees(cartographic.longitude), Cesium.Math.toDegrees(cartographic.latitude)], gcoord.WGS84, gcoord.GCJ02)
        cartographic.longitude = Cesium.Math.toRadians(correct[0])
        cartographic.latitude = Cesium.Math.toRadians(correct[1])
        return super.project(cartographic, result)
      }
      unproject (cartesian, result) {
        result = super.unproject(cartesian, result)
        const correct = gcoord.transform([Cesium.Math.toDegrees(result.longitude), Cesium.Math.toDegrees(result.latitude)], gcoord.GCJ02, gcoord.WGS84)
        result.longitude = Cesium.Math.toRadians(correct[0])
        result.latitude = Cesium.Math.toRadians(correct[1])
        return result
      }
    }  
    Cesium.GaoDeMercatorProjection = GaoDeMercatorProjection
    class GaoDeMercatorTilingScheme extends Cesium.WebMercatorTilingScheme {
      constructor (options) {
        super(options)
        this._projection = new Cesium.GaoDeMercatorProjection(this._ellipsoid);
      }
    }
    Cesium.GaoDeMercatorTilingScheme = GaoDeMercatorTilingScheme
    class GaoDeImageryProvider extends Cesium.UrlTemplateImageryProvider {
      constructor (param, options = {}) {
        var templateUrl = "//wprd0{s}.is.autonavi.com/appmaptile?x={x}&y={y}&z={z}&{p}"
        // var templateUrl = "//webst{s}.is.autonavi.com/appmaptile?x={x}&y={y}&z={z}&{p}"
        var myUrl = templateUrl.replace(/\{p\}/g, param)
        super(Object.assign({}, { url: myUrl, subdomains: "1234", minimumLevel: 1, maximumLevel: 18, tilingScheme: new Cesium.GaoDeMercatorTilingScheme() }, options))
      }
    }
    Cesium.GaoDeImageryProvider = GaoDeImageryProvider

    Cesium.Ion.defaultAccessToken = "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiIwNGNmNWUwMi02NWEyLTQxNzItOTNhNC1mY2NiZTcxNDc2OWYiLCJpZCI6MTU5NDQsInNjb3BlcyI6WyJhc2wiLCJhc3IiLCJhc3ciLCJnYyJdLCJpYXQiOjE1NjkyMjk3MTN9.PYUfCHykW23NuwRzzz04yW7JyZ4vQlcb4kToZ44r42w"
    Cesium.Camera.DEFAULT_VIEW_RECTANGLE = Cesium.Rectangle.fromDegrees(118.282527, 29.692229, 118.360733, 29.724694) // 设置相机默认范围为自定义区域
    Cesium.Camera.DEFAULT_VIEW_FACTOR = 0
    // console.debug(viewer.camera.computeViewRectangle()) // 可以返回当前区域矩形,以弧度为单位 
    var viewer = new Cesium.Viewer("map", {
      animation: false, // 是否显示动画控件
      baseLayerPicker: true, // 是否显示图层选择控件
      vrButton: false, // 是否显示VR控件
      fullscreenButton: false, // 是否显示全屏按钮
      geocoder: false, // 是否显示地名查找控件
      homeButton: false, // 是否显示返回主视角控件
      sceneModePicker: false, // 是否显示投影方式控件
      selectionIndicator: false, // 是否显示选中指示框
      timeline: false, // 是否显示时间线控件
      navigationHelpButton: false, // 是否显示帮助信息控件
      infoBox: false, // 是否显示点击要素之后显示的信息
    })
    viewer.imageryLayers.removeAll(viewer.imageryLayers.get(0)) // 移除 Cesium 默认图层
    viewer.scene.globe.baseColor = new Cesium.Color(0, 0, 0, 0)  // 设置地球背景色黑色

    var c6000_Layer = new Cesium.GaoDeImageryProvider("lang=zh_cn&style=6&ltype=0&scl=0&size=0"), // 影像底图
      c8000_Layer = new Cesium.GaoDeImageryProvider("lang=zh_cn&style=8&ltype=0&scl=0&size=0"), // 影像标注,路网 + 注记
      c8200_Layer = new Cesium.GaoDeImageryProvider("lang=zh_cn&style=8&ltype=2&scl=0&size=0"), // 影像标注,路网
      c8400_Layer = new Cesium.GaoDeImageryProvider("lang=zh_cn&style=8&ltype=4&scl=0&size=0"), // 影像标注,注记
      c7000_Layer = new Cesium.GaoDeImageryProvider("lang=zh_cn&style=7&ltype=0&scl=0&size=0"), // 电子地图,区域面 + 路网 + 注记 + 楼块
      c7100_Layer = new Cesium.GaoDeImageryProvider("lang=zh_cn&style=7&ltype=1&scl=0&size=0"), // 电子底图,区域面
      c7200_Layer = new Cesium.GaoDeImageryProvider("lang=zh_cn&style=7&ltype=2&scl=0&size=0"), // 电子标注,路网
      c7300_Layer = new Cesium.GaoDeImageryProvider("lang=zh_cn&style=7&ltype=3&scl=0&size=0"), // 电子底图,区域面 + 路网
      c7400_Layer = new Cesium.GaoDeImageryProvider("lang=zh_cn&style=7&ltype=4&scl=0&size=0"), // 电子标注,注记
      c7500_Layer = new Cesium.GaoDeImageryProvider("lang=zh_cn&style=7&ltype=5&scl=0&size=0"), // 电子底图,区域面 + 注记
      c7600_Layer = new Cesium.GaoDeImageryProvider("lang=zh_cn&style=7&ltype=6&scl=0&size=0"), // 电子标注,路网 + 注记
      c7700_Layer = new Cesium.GaoDeImageryProvider("lang=zh_cn&style=7&ltype=7&scl=0&size=0"), // 电子底图,区域面 + 路网 + 注记
      c7800_Layer = new Cesium.GaoDeImageryProvider("lang=zh_cn&style=7&ltype=8&scl=0&size=0"), // 电子底图,楼块
      c7020_Layer = new Cesium.GaoDeImageryProvider("lang=zh_cn&style=7&ltype=0&scl=2&size=0") // 电子底图,区域面 + 路网 + 楼块
    var n7000_Layer = new Cesium.GaoDeImageryProvider("style=7&ltype=0&scl=0&size=0"), // 旧版电子地图,中文标注
      e0000_Layer = new Cesium.GaoDeImageryProvider("lang=zh_en&style=7&ltype=0&scl=0&size=0") // 旧版电子地图,英文标注

    viewer.baseLayerPicker._dropPanel.children[0].innerHTML = "底图"
    viewer.baseLayerPicker.viewModel.imageryProviderViewModels = [
      new Cesium.ProviderViewModel({ creationFunction: function () { return c6000_Layer }, name: "影像底图" }),
      new Cesium.ProviderViewModel({ creationFunction: function () { return c8000_Layer }, name: "影像标注,路网 + 注记" }),
      new Cesium.ProviderViewModel({ creationFunction: function () { return c8200_Layer }, name: "影像标注,路网" }),
      new Cesium.ProviderViewModel({ creationFunction: function () { return c8400_Layer }, name: "影像标注,注记" }),
      new Cesium.ProviderViewModel({ creationFunction: function () { return c7000_Layer }, name: "电子地图,区域面 + 路网 + 注记 + 楼块" }),
      new Cesium.ProviderViewModel({ creationFunction: function () { return c7100_Layer }, name: "电子底图,区域面" }),
      new Cesium.ProviderViewModel({ creationFunction: function () { return c7200_Layer }, name: "电子标注,路网" }),
      new Cesium.ProviderViewModel({ creationFunction: function () { return c7300_Layer }, name: "电子底图,区域面 + 路网" }),
      new Cesium.ProviderViewModel({ creationFunction: function () { return c7400_Layer }, name: "电子标注,注记" }),
      new Cesium.ProviderViewModel({ creationFunction: function () { return c7500_Layer }, name: "电子底图,区域面 + 注记" }),
      new Cesium.ProviderViewModel({ creationFunction: function () { return c7600_Layer }, name: "电子标注,路网 + 注记" }),
      new Cesium.ProviderViewModel({ creationFunction: function () { return c7700_Layer }, name: "电子底图,区域面 + 路网 + 注记" }),
      new Cesium.ProviderViewModel({ creationFunction: function () { return c7800_Layer }, name: "电子底图,楼块" }),
      new Cesium.ProviderViewModel({ creationFunction: function () { return c7020_Layer }, name: "电子底图,区域面 + 路网 + 楼块" }),
      new Cesium.ProviderViewModel({ creationFunction: function () { return n7000_Layer }, name: "旧版电子地图,中文标注" }),
      new Cesium.ProviderViewModel({ creationFunction: function () { return e0000_Layer }, name: "旧版电子地图,英文标注" })
    ]
    // viewer.baseLayerPicker.viewModel.selectedImagery = viewer.baseLayerPicker.viewModel.imageryProviderViewModels[0]

    viewer.baseLayerPicker._dropPanel.children[2].innerHTML = "地形"
    viewer.baseLayerPicker.viewModel.terrainProviderViewModels = []
    viewer.entities.add({ position: Cesium.Cartesian3.fromDegrees(118.321499, 29.708050), point: { pixelSize: 5, color: Cesium.Color.RED } }) //添加点用于纠偏测试

    var test_Layer = null
    function loadTile (param) {
      if (!window.event || window.event.keyCode === 13) { // keyCode === 13 表示按下回车
        if (test_Layer !== null) {
          viewer.imageryLayers.remove(test_Layer, true)
          test_Layer = null
        }
        if (!param) return
        test_Layer = viewer.imageryLayers.addImageryProvider(new Cesium.GaoDeImageryProvider(param))
      }
    }
    var param = "lang=zh_cn&style=6&ltype=0&scl=0&size=0"
    document.getElementById("url-input").value = param
    loadTile(param)
  </script>
</html>

参考链接

其他文章:https://www.cnblogs.com/nodegis/p/11206642.html
高德地图控制台:https://www.amap.com/

  • 3
    点赞
  • 13
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
要实现leaflet加载自定义高德地图后坐标类型为gcj02,你需要进行以下步骤: 1. 在高德开放平台上申请自定义地服务并获取到对应的key。 2. 在Leaflet中添加高德地图服务的层,示例代码如下: ``` L.tileLayer('https://webst01.is.autonavi.com/appmaptile?style=6&x={x}&y={y}&z={z}', { attribution: '高德地图', maxZoom: 18 }).addTo(map); ``` 3. 在Leaflet中添加坐标转换插件,这里推荐使用proj4leaflet插件。在使用之前,需要将proj4库引入到项目中。示例代码如下: ``` // 添加proj4库 <script src="https://cdnjs.cloudflare.com/ajax/libs/proj4js/2.6.2/proj4.js"></script> // 定义高德地图的投影坐标系 proj4.defs("EPSG:102100", "+proj=merc +a=6378137 +b=6378137 +lat_ts=0.0 +lon_0=0.0 +x_0=0.0 +y_0=0 +k=1.0 +units=m +nadgrids=@null +wktext +no_defs"); // 在Leaflet中添加坐标转换插件 L.Proj.geoJson(data, { 'pointToLayer': function(feature, latlng) { return L.marker(latlng); } }, { 'coordsToLatLng': function(coords) { var point = L.point(coords[0], coords[1]); point = L.Proj.transform(proj4.defs("EPSG:102100"), L.CRS.GCJ02.projection, point); return L.CRS.GCJ02.pointToLatLng(point); } }).addTo(map); ``` 4. 将Leaflet的坐标系设置为GCJ02,示例代码如下: ``` L.CRS.GCJ02 = L.extend({}, L.CRS.EPSG3857, { // 将EPSG3857的投影坐标系转换为GCJ02的投影坐标系 transformation: L.transformation(1 / 128, -1 / 128, -1 / 128, 1 / 128), // 将EPSG3857的地理坐标系转换为GCJ02的地理坐标系 code: 'GCJ02' }); // 将地的坐标系设置为GCJ02 map.options.crs = L.CRS.GCJ02; ``` 通过以上步骤,你就可以实现leaflet加载自定义高德地图后坐标类型为gcj02了。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值