bigpin

bigPinAPI文档

使用示例

import bigPin from 'bigpin-js'

初始化：

• canvas: dom容器
• imgUrl: 图片地址

// example
    let BigPin=new bigPin({
            canvas:canvas,
            imgUrl:'C://jyz_work/newproject/bigPin/test/snow.jpg'
        })

图片上打点：方法名 bigDrawPin

• options: {color:'点颜色（默认蓝色）',r:点半径（默认5）}

    var option={
                color:"pink",
                r:8,
            }
    BigPin.bigDrawPin(option)

结束打点：方法名 bigEndDraw

    BigPin.bigEndDraw()

保存点信息：方法名 bigSavePoints

    const points=BigPin.bigSavePoints()
    console.log(`图片上所有点信息：${points} `);

点回显：方法名 bigLoadPin

• position：[{x:横坐标,y:纵坐标,color:'点颜色（默认蓝色）',r:点半径（默认5）}] 位置信息
• r:统一半径
• color: 统一颜色

    const points={
        position:[{
            x:10,
            y:20,
            r:10,
            color:'yellow'
        },{
            x:100,
            y:50,
            r:5,
            color:'red'
        },],
        r:6,
        color:'pink'
    }
    BigPin.bigLoadPin({position:loadPoints})

清除标记点：方法名 bigClearDraw

    BigPin.bigClearDraw()

点击标记点并做特殊操作：方法名 bigCanvasClick

• tolerance:容错半径，默认10

    var canvas=BigPin.bigCanvasClick({tolerance:10})
    canvas.on('click', (e)=>{
        console.log('点击了canvas标记', e)
    });