更新记录

1.0.1（2023-02-23） 下载此版本

优化

1.0.0（2023-02-22） 下载此版本

初次发布

平台兼容性

uni-app

其他

daxiang-select-point

简介

可以在图片进行选点，返回所有点的坐标。并且支持多图拼接。

组件参数

使用示例

复制代码<template>
    <daxiang-select-point
      scale_width="750rpx"
      :points="point_list"
      @submit="onPointSubmit"
      ref="select"
      :src_list="src_list"
      :limit="num">
    </daxiang-select-point>
</template>
<script>
export default {
    data(){
        return {
            point_list:[],
            src_list:['xxx.jpg','yyy.jpg'],
            num:10
        }
    },
    methods:{
        /**
         * @param {Array} data
         * [{left:'100rpx',top:'100rpx'},{left:'200rpx',top:'100rpx'},...]
         * 如果 scale_width 不传，则单位为px
         */
        onPointSubmit(data){
            this.point_list = data;
            // 进行其余的逻辑处理
        }
    }
}
</script>

可视化操作描述

组件采用了scroll-view对长图进行显示的适配 选点后，再次点击某个选点会选中这个点，此时可选择将该点删除。删除时支持点击按钮、或PC端使用键盘快捷键 del或backspace