Matthew Harwood Matthew Harwood - 5 months ago 11
Javascript Question

Typeerror when trying to use getContext('2d') from canvas

Why am I getting a type error when I try to

getContext
on my
el.canvas
Obj
html:

//created a directive called canvas-video-map
<div id="video-to-canvas" canvas-video-map>

<video id="menu-video" loop autoplay video-loader preload="auto">
<source src="../../images/clouds.mp4" type="video/mp4">
</video>

<canvas id='menu-canvas'></canvas>
</div>


JS:

.directive('canvasVideoMap', function() {
return function(scope, element, attrs) {
angular.element(document).ready(function() {
//findes and maps the element children (video and canvas)
var el = {
video: element.find('video'),
canvas: element.find('canvas')
};
console.log(el.canvas);
// Type error is from here when i try to getContext
var context = el.canvas.getContext('2d');




}, false);
};
});


enter image description here

Answer
element.find('canvas')

returns an array. Use

el.canvas[0].getContext('2d')
Comments