CODEWITHSUNDEEP
javascriptjqueryhtml
EnexoOnoma
EnexoOnoma

Reputation: 8836

Empty the content of a div using jQuery. Can not make it work

I use this example that allow me to draw into the canvas. http://devfiles.myopera.com/articles/649/example2.html

However, I want to have a button that clears the content of it. This is what I did without luck.

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>

<script type="text/javascript">
    $(document).ready(function () {
      $("#clearme").click(function() {
       var view = $('#imageView');
       var context = view[0].getContext('2d');
       context.clearRect(550, 550, view.width(), view.height());
      });
    });

<a href="#" id="clearme">clear</a>

<div id="container">
      <canvas id="imageView" width="610" height="680">
      </canvas>
</div>

What am I missing here?

Upvotes: 2

Views: 593

Answers (3)

Jon Gauthier
Jon Gauthier

Reputation: 25572

Clear the canvas via its API instead:

var view = $('#imageView');
var context = view[0].getContext('2d');
context.clearRect(0, 0, view.width(), view.height());

Upvotes: 3

elclanrs
elclanrs

Reputation: 94101

You have to clear the canvas, empty() is not what you're looking for. Do something like this:

var ctx = canvasEl.getContext('2d');
ctx.clearRect(0, 0, canvasEl.width, canvasEl.height);
ctx.beginPath();

Upvotes: 3

Ken Wheeler
Ken Wheeler

Reputation: 1958

Empty() wont clear a canvas. You'll have to use clearRect.

Upvotes: 1

Related Questions