Canvas How to - Output canvas properties

Question

We would like to know how to output canvas properties.

Answer


<!--from w  w  w .java 2  s.  com-->


<!DOCTYPE html>
<html>
<head>
<script type='text/javascript'
  src='http://code.jquery.com/jquery-git.js'></script>
<script type='text/javascript'>//<![CDATA[ 
$(function(){
    var getCanvasInfo = function (canvas) {
        var props = [],
            prop,
            ctx = canvas.getContext('2d');
        for (prop in ctx) {
            if ( prop !== "canvas" &&
                typeof ctx[prop] !== "function")
            {
                props.push(prop);
            }
        }
        return props.sort().map(function (p) {
            return p + ": " + ctx[p];
        }).join("\n");
    };
    console.log( getCanvasInfo( $("canvas")[0] ) );
});//]]>  
</script>
</head>
<body>
  <canvas></canvas>
</body>
</html>

The code above is rendered as follows: