snippingtool

This is a screenshot tool. It has a color brush to mark screenshots

Usage no npm install needed!

<script type="module">
  import snippingtool from 'https://cdn.skypack.dev/snippingtool';
</script>

README

snippingtool

It is a Vue screenshot annotation widget

It can intercept any position in the web page, and has a small color brush to mark within the intercepted range. Finally, it is saved as a PNG file locally together with the marked content.

dependencies

It relies on jQuery and html2canvas, so make sure your project has both plug-ins installed before use.

install

npm i snippingtool

jQuery and snippingtool should been introduced into the current component.

import  {startCapture} from 'snippingtool'
import $ from 'jquery'

Write a method

methods:{
    draw(){
    startCapture($("body"));
    }
}

Add this method to the event of any button in the component template.

<button @click="draw">snippingtool</button>

authorsunritzWelcome to communicate.