I am using asp.net core mvc html javascript, When i press mouse for signature its draw signature but when i leave mouse and again start signature its delete previous signature.
I want to keep previous signature/drawing, even i press/draw again signature on it.

 <script type="text/javascript">
    $("body").on("click", "#btnSubmit", function () {
        var base64 = $('#colors_sketch')[0].toDataURL();
        $("input[name=base64String]").val(base64);
    });
    $(function () {
        $('#colors_sketch').sketch();
        $(".tools a").eq(0).attr("style", "color:#000");
        $(".tools a").click(function () {
            $(".tools a").removeAttr("style");
            $(this).attr("style", "color:#000");
        });

    });

    function clearstate() {

        window.localStorage.clear();
    }
       </script>


          <div class="modal-body">
                    <div class="tools">
                        <a href="#colors_sketch" data-tool="marker">Draw</a> <a href="#colors_sketch" data-tool="eraser">
                            Erase
                        </a>
                    </div>
                    <br />
                    <canvas id="colors_sketch" height="80" style="border: 1px solid #ccc;width:100%;">
                    </canvas>
                    <input type="hidden" name="base64String" id="base64String" />
                </div>