2013-04-24 2 views
0

У меня есть грань гармоник, который имеет коллекцию изображений. Я отобразил эти изображения с помощью jsf < h:graphicImage> тэг с помощью сервлета (на самом деле я показываю миниатюру исходного изображения).Отображение изображений onclick с использованием графического тега графического объекта Jsf

Хочу, чтобы я хотел, чтобы всякий раз, когда пользователь нажимает на определенное изображение в аккордеоне, в моем элементе холста HTML5 должно отображаться одно и то же изображение.

Ваша помощь ценится

+0

Ваш вопрос очень общий и расплывчатый характер. Где именно вы застреваете при написании кода соответственно? – BalusC

+0

Хм .. мне нравится, что я успешно отобразил изображения в аккордеоне, теперь, когда пользователь нажимает на определенное изображение, это изображение должно отображаться в моем холсте HTML5. Я не уверен, как передать значение выбранного изображения в элемент холста. К сожалению, я не могу опубликовать код, извините за это. – user1432155

ответ

1

Вы должны быть в состоянии сделать что-то вроде этого:

<h:graphicImage library="default" name="images/graph.png" onclick="draw(this.src);" /> 
<canvas id="myCanvas"></canvas> 
<script type="text/javascript"> 
    function draw(imgSrc) { 
     console.log(imgSrc); 
     var ctx = document.getElementById('myCanvas').getContext('2d'); 
     var img = new Image(); 
     img.src = imgSrc; 
     ctx.drawImage(img, 0, 0); 
     ctx.beginPath(); 
     ctx.moveTo(30, 96); 
     ctx.lineTo(70, 66); 
     ctx.lineTo(103, 76); 
     ctx.lineTo(170, 15); 
     ctx.stroke(); 
     return false; 
    } 
</script> 

Подробнее: https://developer.mozilla.org/en-US/docs/HTML/Canvas/Tutorial/Using_images

Смежные вопросы