vue在平面座位图上标点

1. 首先需要准备一个平面座位图的图片，可以使用第三方工具或手动绘制。

2. 在Vue组件中引入该图片，并使用`<img>`标签展示出来。

3. 使用Vue的`v-for`指令循环遍历需要标点的位置，生成对应的DOM元素。例如：

<template>
  <div class="seat-map">
    <img src="./seat-map.jpg" alt="座位图">
    <div v-for="(point, index) in points" :key="index" class="point" :style="{ left: point.x + 'px', top: point.y + 'px' }"></div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      points: [
        { x: 100, y: 200 },
        { x: 300, y: 400 },
        // ...
      ]
    }
  }
}
</script>

<style>
.point {
  position: absolute;
  width: 10px;
  height: 10px;
  background-color: red;
  border-radius: 50%;
}
</style>

4. 在样式中设置标点的样式和位置，使用`position: absolute`将其定位在座位图上，使用`left`和`top`属性设置其坐标位置。

5. 完成后，用户就可以在平面座位图上看到标点了。