Beispiele für die korrekte Verwendung von Karten in WeChat-Miniprogrammen

"Erlaubnis": {
  "scope.Benutzerstandort": {
    "desc": "Ihre Standortinformationen werden verwendet, um die Wirkung der Miniprogramm-Standortschnittstelle anzuzeigen"
  }
}

// Globale Variable globalData: {
    Benutzerinfo: null
  },
// Globale Importmethode, einfacher Import von Drittanbieterpaketen require: ($url)=> require($url)

//SDK-Kernklasse einführen const QQMapWX = require('./qqmap-wx-jssdk.min.js');
//Instanziieren Sie die API-Kernklasse let key = '';
lass qqmapsdk;
Schlüssel &&(qqmapsdk = neues QQMapWX({
  Schlüssel // erforderlich}));
modul.exporte = {
  qqmapsdk,
  Schlüssel
}

<Ansicht>
	<van-btn bind:tap="gotoMap" type="info">Zur Karte</van-btn>
</Ansicht>

//Die erforderlichen Toolfunktionen einführen const app = getApp();
const {qqmapsdk} = app.require('utils/util');
Seite({
  /**
   * Startposition auf der Karte */
  // Klicken Sie auf die Schaltfläche, um zur Kartenseite zu springen gotoMap(){
     wx.showLoading({
       Titel: „Weiterleitung zur Kartenseite“
     })
    // Bevor Sie springen, müssen Sie einige Dinge tun, um das Benutzererlebnis zu verbessern // 1. Überprüfen Sie, ob der Benutzer die Standortbestimmung aktiviert hat. Wenn nicht, befolgen Sie die Anweisungen. // 2. Überprüfen Sie die Standortbestimmungsberechtigung des Programms. Wenn nicht, befolgen Sie die Anweisungen. // 3. Führen Sie die beiden oben genannten Punkte aus, bevor Sie mit dem Springen beginnen können. wx.getLocation({
      Erfolg(res){
        wx.navigateTo({
          URL: "/Seiten/Karte/Index"
        })
      },
      scheitern(e) {
        wenn (e && (e.errCode == 2 || e.errCode == 404)) {
          wx.showModal({
            Titel: "Tipps",
            Inhalt: „Standortinformationen konnten nicht abgerufen werden. Bitte überprüfen Sie, ob die „Standortinformationen“ des Mobiltelefons aktiviert sind.“
            anzeigenAbbrechen: false
          })
        } sonst wenn (e && ((e.errMsg.indexOf('getLocation:fail auth deny') != -1) || (e.errMsg.indexOf('Systemberechtigung verweigert') != -1))) {
          zeigeModal({
            Titel: "Tipps",
            Inhalt: „Standortinformationen konnten nicht abgerufen werden. Bitte prüfen Sie, ob WeChat über die Standortberechtigung verfügt.“
            confirmText: "Erneut erwerben",
            Erfolg(res){
              wenn(res.confirm === true){
                Detektoreinstellungen ()
              } sonst wenn(res.cancel == true){
                zurückkehren;
              }
            }
          })
        } sonst wenn(e.errMsg.indexOf("frequent") !== -1){
          wx.showModal({
            Titel: "Tipps",
            Inhalt: „Die Schnittstelle für Standortinformationen wird zu häufig aufgerufen. Bitte warten Sie 10–30 Sekunden, bevor Sie sie erneut aufrufen.“
            anzeigenAbbrechen: false
          })
        }
      },
      vollständig(){
        wx.hideLoading()
      }
    })
    // Anleitung zum Aktivieren der WeChat-Standortberechtigungsfunktion detectSettings(){
      wx.getSetting({
        Erfolg(res){
          wenn(res && (res.authSetting["scope.userLocation"] !== undefiniert && res.authSetting["scope.userLocation"] !==true)){
            wx.showModal({
              Titel: "Tipps",
              Inhalt: „Das Miniprogramm verfügt nicht über die Standortberechtigung. Bitte gehen Sie zum Festlegen der Standortberechtigung für das WeChat-Miniprogramm.“
              confirmText: "Gehe zu den Einstellungen",
              Erfolg(res){
                wenn(res.cancel == true){
                  zurückkehren
                } sonst wenn (res.confirm === true){
                  wx.openSetting({
                    Erfolg(Ergebnis){
                      wenn (Ergebnis && (Ergebnis.authSetting["scope.userLocation"] !== undefiniert && Ergebnis.authSetting["scope.userLocation"] ===true)) {
                        wx.navigateTo({
                          URL: "/Seiten/Karte/Index"
                        })
                      } anders {
                        wx.navigateTo({
                          URL: "/Seiten/Index/Index"
                        })
                      }
                    },
                  })
                } 
              },
              scheitern(){
                wx.navigateTo({
                  URL: "/Seiten/Index/Index"
                })
              }
            })
          } anders {
            wx.navigateTo({
              URL: "/Seiten/Karte/Index"
            })
          }
        },
        vollständig(){
          wx.hideLoading()
        }
      })
    }
   }
})

<!--pages/map/index.wxml-->
<view class="feste Oberseite">
  <van-search bind:search="searchSchool" placeholder="Bitte geben Sie den Namen der Schule ein" model:value="{{schoolName}}" />
  <Klasse anzeigen="Schul-Navigation">
    <text class="left">Schulen in der Nähe</text>
    <view class="right" bind:tap="changeCity">
      <van-icon name="Standort-o" />
      <text>{{Stadt || "Peking"}}</text>
    </Ansicht>
  </Ansicht>
</Ansicht>
<view class="addr-cell" bindtap="subData">
  <block wx:für="{{Optionen}}" wx:Schlüssel="Index">
    <van-cell data-chooseOpt="{{item}}" title-width="70vw" title="{{item.title}}" value="" label="{{item.address}}" />
  </block>
  <Ansichts-ID="txt" Klasse="btm">
    <text wx:if="{{options.length}}">{{count>0 ? "Zum Aktualisieren nach unten ziehen und weitere Informationen erhalten" : "Sie haben das Ende bereits erreicht"}}</text>
    <text class="no-data" wx:else>Es wurden keine relevanten Daten erhalten. . . </text>
  </Ansicht>
</Ansicht>	

//Die erforderlichen Toolfunktionen einführen const app = getApp();
const {qqmapsdk,key} = app.require('utils/util');
// Lebenszyklusfunktion initialisieren onLoad: function (options) {
  _dies = dies;
  _this.init()
},

// Ihre Adresse wird analysiert und der aktuelle Standort wird ermittelt init(location){
  let Abfrage = {
    Erfolg(res){
      Konsole.log(res)
      wenn(res.status === 0) {
        // konsole.log(res.ergebnis.standort)
        app.globalData.adInfo = res.result.ad_info;
        _this.setData({
          Stadt: res.result.ad_info.city,
          lat: res.result.location.lat,
          lng:res.ergebnis.standort.lng,
        })
        _this.qqSearch();
      } anders {
        wx.showModal({
          Titel: 'Tipps',
          content:res.message || „Die geografischen Standortinformationen konnten nicht abgerufen werden.“
          anzeigenAbbrechen: false
        })
      }
    },
    scheitern(e) {
      console.log(e)
    }
  }
  Standort && (Abfrage.Standort = Standort);
  qqmapsdk.reverseGeocoder(Abfrage);
}

// Wenn die Eingabe eine Stadt ist, wird nur die Stadt angezeigt, ohne die Schule anzuzeigen searchSchool(e){
  // Keine Eingabe oder kein Eingabebereich if(e && (!e.detail || e.detail.trim() === '')){
    wx.showToast({
      Titel: „Bitte geben Sie einen gültigen Schulnamen ein“,
      Symbol: „keine“,
      Dauer: 2000
    })
    zurückkehren
  }
  _this.setData({
    Optionen:[],
    Anzahl: -2
  })
  _this.qqSearch(e.detail);
},
qqSuche(Name){
  // Geben Sie den Namen der Schule in das Eingabefeld ein wx.showLoading({
    Titel: „Informationen einholen“
  })
  const mks = [];
  lass zählen,
      Grenze = `in der Nähe(${_this.data.lat},${_this.data.lng},1000)`;
  Suche (Name)
  Funktion Suche(Name){
    Konstantenoptionen = {
      keyword: 'Universität', //Suchbegriffe page_size: 15,
      page_index: _this.data.pageIndex, // Weitere Schlüssel abrufen: key,
      Grenze
    };
    wenn(Name){
      opts.boundary = `Region(${_this.data.city})`
      opts.keyword = Name
    }
    // Der Hauptzweck besteht hier darin, Fehler zu vermeiden, die durch hochfrequente Schnittstellenaufrufe verursacht werden, sodass nur die URL verwendet werden kann, um relevante Informationen abzurufen wx.request({
      URL: "https://apis.map.qq.com/ws/place/v1/search",
      Methode: "get",
      Daten:{
        ...wählt
      },
      Erfolg: Funktion (res) { //Rückruf nach erfolgreicher Suche console.log(res)
        wenn(res.statusCode !== 200 || (res.data && res.data.status !== 0)) return;
        // Initialisierung und andere Zustände // Berechnen Sie, wie oft Sie nach unten rutschen können, um mehr zu erhalten, wenn (_this.data.count === -1 || _this.data.count === -2) {
          Anzahl = res.data.count und Math.floor(res.data.count/10);
        }anders {
          Anzahl = --_this.data.count;
        }
        für (lass i = 0; i < res.data.data.length; i++) {
          mks.push({ // Das zurückgegebene Ergebnis abrufen und in das mks-Array einfügen title: res.data.data[i].title,
            Adresse: res.data.data[i].address,
          })
        }
      },
      Fehler: Funktion (e) {
        console.log(e)
        wx.showToast({
          Titel: JSON.stringify(e) || "Karteninformationen konnten nicht abgerufen werden",
          Symbol: "keine",
          Dauer: 3000
        })
      },
      vollständig: Funktion (){
        setzeTimeout(()=>{
          wx.hideLoading()
          mks.push(..._diese.Daten.Optionen);
          _this.setData({ //Setze die Marker-Eigenschaft, um die Suchergebnisse auf der Karte anzuzeigen options: mks,
            zählen
          })
        },1000)
      }
    });
  }
},

// Nach unten rutschen Lebenszyklusfunktion onReachBottom: function () {
  _this.data.pageIndex = ++_this.data.pageIndex;
  _this.data.count und _this.qqSearch();
},

subDaten(e){
  const data = e.target.dataset.chooseopt;
  //Behandeln Sie die Situation des Klickens auf die Eingabeaufforderung textif(!data) return;
  wx.showModal({
    Titel: "Tipps",
    Inhalt: `Ist Ihre Schule [${data.title}]? `,
    Erfolg(res){
      // Abbrechen if(res.cancel) {
        zurückkehren;
      } sonst wenn (res.bestätigen){
        // OK // Anfragen zum Hinzufügen oder Ändern im Backend erfordern normalerweise eine detaillierte Adresse, hier ist ein einfacher Vorgang wx.showToast({
          Titel: Daten.Titel,
          Symbol: „keine“
        })
      }
    },
    scheitern(){
      wx.showToast({
        Titel: "Misserfolg",
        Symbol: „Fehler“
      })
    }
  })
}

Stadt ändern(){
  _this.setData({
    Optionen:[],
    Anzahl: -2,
    // Einfache bidirektionale Datenbindung, lösche den Inhalt des Eingabefelds, wenn du „schoolName“ eingibst: ''
  })
  wx.Wählen Sie den Standort({
    Breitengrad:_this.data.lat,
    Längengrad:_this.data.lng,
    Erfolg(res){
      wenn(res.errMsg === "chooseLocation:ok"){
        // Den ausgewählten Standort abrufen und Längen- und Breitengrad anhand der inversen Adresse analysieren parsing_this.init(`${res.latitude},${res.longitude}`);
      }
    },
    //Drücken Sie die Abbrechen-Taste fail(e){
      if(e.errMsg === "chooseLocation:fail cancel"){
        _this.init();
      }
    },
    vollständig(){
    }
  })
}