map

<!-- map.ttml -->
<map
  id="myMap"
  show-location
  longitude="{{longitude}}"
  latitude="{{latitude}}"
  circles="{{circles}}"
  markers="{{markers}}"
  polyline="{{polyline}}"
  include-points="{{includepoints}}"
  scale="{{scale}}"
  bindtap="maptap"
  bindmarkertap="markertap"
  bindcallouttap="callouttap"
  bindregionchange="regionchange"
  style="width:100%; height: 300px;"
></map>

// map.js
Page({
  data: {
    latitude: 39.915,
    longitude: 116.404,
    scale: 15,
    circles: [
      {
        latitude: 39.915,
        longitude: 116.404,
        radius: 400,
      },
    ],
    includepoints: [
      {
        latitude: 39.915,
        longitude: 116.404,
      },
      {
        longitude: 116.405,
        latitude: 39.92,
      },
      {
        longitude: 116.423493,
        latitude: 39.907445,
      },
      {
        latitude: 39.915,
        longitude: 116.404,
      },
      {
        longitude: 116.423493,
        latitude: 39.907445,
      },
    ],
    markers: [
      {
        id: 1,
        latitude: 39.915,
        longitude: 116.404,
        title: "这是地标1",
      },
      {
        id: 2,
        longitude: 116.405,
        latitude: 39.92,
        title: "这是地标2",
      },
    ],
    polyline: [
      {
        points: [
          {
            latitude: 39.915,
            longitude: 116.404,
          },
          {
            longitude: 116.405,
            latitude: 39.92,
          },
          {
            longitude: 116.423493,
            latitude: 39.907445,
          },
        ],
        dottedLine: false,
        arrowLine: false,
      },
    ],
  },
  onReady: function (e) {
    this.mapCtx = tt.createMapContext("myMap");
  },
  markertap(e) {
    console.log("tap marker", e);
  },
  maptap(e) {
    console.log("tap map", e);
  },
  callouttap(e) {
    console.log("tap callout", e);
  },
  regionchange(e) {
    console.log("regionchange", e);
  },
});