获取图片坐标，后端使用Graphics2D画图

获取图片坐标：

img标签中加入

@click='tapMap($event)'

    tapMap(e) {

        let x = e.layerX;

        let y = e.layerY;

    },

和Graphics2D坐标不一致需要减去偏移量。

 

Graphics2D读取图片并画图：

    public void createImg() throws IOException {
        BufferedImage bufferedImage = null;
        try {
            bufferedImage = ImageIO.read(new FileInputStream("D:\\1.png"));
        } catch (FileNotFoundException e1) {
            e1.printStackTrace();
        } catch (IOException e1) {
            e1.printStackTrace();
        }
        Graphics2D graphics2D = (Graphics2D) bufferedImage.getGraphics();
        graphics2D.setBackground(Color.RED);
        graphics2D.clearRect(33,34,20,20);
        graphics2D.setPaint(Color.BLUE);
        graphics2D.drawRect(33, 34, 20, 20);
        try {
            ImageIO.write(bufferedImage, "png",new FileOutputStream("D:\\2.png"));
        } catch (FileNotFoundException e) {
            e.printStackTrace();
        } catch (IOException e) {
            e.printStackTrace();
        }
    }