0
J'utilise un module de AngularJs qui dessine des polygones sur la zone sélectionnée. Demo disponible ci-dessous: https://sedrakpc.github.io/ comme on le voit ici, l'image est peuplée de fond: url propriété CSS 
AngularJS + Toile et image d'arrière-plan remplaçant
Mon but est de remplacer cette image en fonction de sélection déroulante. Je pris quelques recherches sur les parties de code du module:
link: function(scope, element, attrs, ctrl){
var activePoint, settings = {};
var $canvas, ctx, image;
settings.imageUrl = scope.imageUrl;
if(!scope.points) {
scope.points = [[]];
}
if(!scope.active) {
scope.active = 0;
}
$canvas = $('<canvas>');
ctx = $canvas[0].getContext('2d');
image = new Image();
scope.resize = function() {
$canvas.attr('height', image.height).attr('width', image.width);
$canvas.attr('height', $canvas[0].offsetHeight).attr('width', $canvas[0].offsetWidth);
scope.draw();
};
$(image).load(scope.resize);
image.src = settings.imageUrl;
if (image.loaded) scope.resize();
$canvas.css({background: 'url('+image.src+')'});
$canvas.css({backgroundSize: 'contain'});
je prévois que je devrais être en mesure de reproduire une partie du code et il suffit de remplacer
$canvas.css({background: 'url('+image.src+')'});
avec mon image (je ne sais pas vouloir changer autre chose que l'arrière-plan). J'ai essayé de le faire sur deux façons, mais il ne fonctionne pas:
$scope.undo = function(){
$scope.imageSrc = "http://localhost:3333/img/1.jpg";
var $canvas, ctx, image;
$canvas = $('<canvas>');
ctx = $canvas[0].getContext('2d');
$canvas.css({background: 'url('+$scope.imageSrc+')'});
$canvas.css({backgroundSize: 'contain'});
// second way
var background = new Image();
background.src = $scope.imageSrc;
background.onload = function(){
ctx.drawImage(background,0,0);
}
};