<template>
<embed class="native-map" tag="map" :options='mapOptions' @markertap='onMarkerTap'></embed>
<!-- <embed class="native-button" tag="button" :options="options" @buttonclick="onClick"></embed> --> </template>
<script>
import "@/uni_modules/native-harmony-map";
export default {
data() {
return {
options: {
latitude: 39.909,
longitude: 116.39742,
scale: 12,
circles: [
{
latitude: 39.909,
longitude: 116.39743,
color: 0xffff0000,
fillColor: 0xff00ffff,
radius: 80,
strokeWidth: 10,
},
],
markers: [
{
latitude: 39.909,
longitude: 116.39742,
},
{
latitude: 39.9,
longitude: 116.39741,
iconPath:
"",
},
],
},
mapOptions: {
center: { latitude: 31.2304, longitude: 121.4737 }, // 上海坐标
zoom: 14,
markers: [{ id: 1, latitude: 31.2304, longitude: 121.4737, title: "陆家嘴" }]
}
// options: {
// label: 'hello'
// }
}; },
methods: {
onMarkerTap(e) {
console.log("onMarkerTap", e);
uni.showToast({
title: "onMarkerTap",
});
},
onClick(e) {
console.log('onClick', e.detail.text)
this.options = {
label: 'world'
}
} },
};
</script>
<style scoped>
.native-button {
display: block;
width: 200px;
height: 50px;
margin: 10px auto;
}
</style>
