Canvas обработчик на нарисованный сектор
Как в конвасе можно выделить сектор и к нему добавить обработчик событий, те чтобы при наведении сектор уменьшался.
Я сделал так, но там обработчик на теге канвасе, а надо на секторе window.onload = main; function main() { function Circle(ctx, w, h, datalist, radius) { var centerx = w / 2; var centery = h / 2; var total = 0; for(x=0; x < datalist.length; x++) { total += datalist[x]; } var lastend=0; var offset = Math.PI / 2; for(x=0; x < datalist.length; x++) { var thispart = datalist[x]; ctx.beginPath(); ctx.fillStyle = colist[x]; ctx.moveTo(centerx,centery); var arcsector = Math.PI * (2 * thispart / total); ctx.arc(centerx, centery, radius[x], lastend - offset, lastend + arcsector - offset, false); ctx.lineTo(centerx, centery); ctx.fill(); ctx.closePath(); lastend += arcsector; } } var h=500; var radius = new Array(h / 2 ,h / 2 ,h / 2 ); var datalist= new Array(120,120,120); var colist = new Array('red', 'green', 'yellow'); var canvas = document.getElementById("myCanvas1"); var ctx = canvas.getContext('2d'); Circle(ctx, canvas.width, canvas.height, datalist, radius); var id; function draw(event) { event = event || window.event; ctx.clearRect(0, 0, canvas.width, canvas.height); radius[0]-=5; id=setTimeout(draw, 50); if(radius[0]<40) { clearTimeout(id); } x= (event.layerX == undefined ? event.offsetX : event.layerX); y= (event.layerY == undefined ? event.offsetY : event.layerY); Circle(ctx, canvas.width, canvas.height, datalist, radius); } canvas.addEventListener('mouseover', draw, false); } |
это невозможно
у canvas нет подэлементов на которые можно вешать обработчики событий, только на canvas
у canvas-context нет api для обработки событий, только для рисования (по крайней мере у '2d'-context, о 'webgl' ничего не знаю) можете проверить сами api здесь или здесь так-что только кастомные решения, свои или чужие |
mta88, можете тогда что-нибудь посоветовать?
была идея отрисовать три слоя подряд канвасом, но пока не исчезнет первый слой (первый сектор), то следующие не обрабатываются. |
а вот кроме www.google.ru/search?q=canvas+framework ничего посоветовать не смогу
область сейчас быстро развивается а я за ней не слежу |
Часовой пояс GMT +3, время: 00:02. |