微信小程序画地块（微信开放文档中腾讯地图）

微信小程序画地块（微信开放文档中腾讯地图）

 

1、map.js

 

// 引入math计算包
var mathjs = require('../../../source/util/math.js');
// 获取所有经纬度
var allarea = []
// 画地块多边形
var temp = []
// 查看是否可以绘制地图
var check = 0
// 设置标点次数
var marker = 0
// 定义两个接收参数变量经纬度，计算前一个点到下一个点的距离
var lat = 0;
var long = 0;
// 周长和
var allperimeter = 0;
Page({
  /**
   * 页面的初始数据
   */
  data: {
    //可以通过hidden是否掩藏弹出框的属性，来指定那个弹出框 
    hiddenmodalput: true,
    // 地图参数配置
    latitude: "",
    longitude: "",
    scale: 10,
    markers: [],
    polygons: [],
    // 设置面积和周长按钮显隐性
    hidden: true,
    // 面积值
    area: 0.00,
    // 周长值
    perimeter: 0.00
  },
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    var that = this
    //获取当前的地理位置、速度
    wx.getLocation({
      type: 'wgs84', // 默认为 wgs84 返回 gps 坐标，gcj02 返回可用于 wx.openLocation 的坐标
      success: function (res) {
        //赋值经纬度
        that.setData({
          latitude: res.latitude,
          longitude: res.longitude,
          scale: 10,
          markers: [],
          polygons: [],
          hidden: true,
          area: 0.00,
          perimeter: 0.00
        })
        //————————————————————————————————————————初始化全局变量参数
        // 获取所有经纬度
        allarea = []
        // 画地块多边形
        temp = []
        // 查看是否可以绘制地图
        check = 0
        // 设置标点次数
        marker = 0
        // 定义两个接收参数变量经纬度
        lat = 0;
        long = 0;
        // 周长和
        allperimeter = 0;
        //————————————————————————————————————————初始化全局变量参数
      }
    })
  },
  // 地图点击事件
  mapclick: function (res) {
    // 判断是否点击 绘制地图 按钮
    if (check == 0) {
      return;
    }
    var that = this;
    // 添加 0.0000000000001 因为polygons至少三个点
    temp.push({
      latitude: res.detail.latitude,
      longitude: res.detail.longitude
    }, {
      latitude: res.detail.latitude,
      longitude: res.detail.longitude
    }, {
      latitude: res.detail.latitude + 0.00000000000001,
      longitude: res.detail.longitude
    })
    // 添加 标记符号和点击的位置经纬度
    that.data.markers.push({
      latitude: res.detail.latitude,
      longitude: res.detail.longitude,
      iconPath: "../../../source/image/dw.png" //cir.png
    })
    // 赋值地图页面属性
    that.setData({
      markers: that.data.markers,
      polygons: [{
        points: temp,