paper.js создать путь к линии над растровым изображением не работает - PullRequest
Новая
       25

paper.js создать путь к линии над растровым изображением не работает

0 голосов
/ 21 мая 2019

Первый раз, используя paper.js и пытаясь позволить пользователю свободной рукой нарисовать линию над растровым изображением. Изображение загружается нормально, но ни одно из событий мыши не запускается.

Я загружаю свое изображение так: 

function loadImage($url, $type = 'load') {

    var $width, $height;

    var $image = new Image();
    $image.src = $url;

    $image.onload = function (imageEvent) {

        var $size = resizeImage($image);
        $width = $size.width;
        $height = $size.height;

        $($canvas).hide();

        if ($type == 'load') {
            paper.project.activeLayer.removeChildren();
            paper.view.draw();
        }

        $raster = new paper.Raster({
            source: $image.src,
            position: view.center,
        });

        if ($image.width > $image.height) {
            $raster.rotate(90);
            $width = $size.height;
            $height = $size.width;
        }

        paper.view.viewSize = new Size($width, $height);
        $raster.fitBounds(paper.view.bounds);

        $canvas.width = $width;
        $canvas.height = $height;

        $($canvas).fadeIn('slow');

    };

}

У меня тогда есть следующие события мыши: 

function onMouseDown(event) {
    console.log('onMouseDown');

    if ($path) {
        path.selected = false;
    }

    $path = new Path({
        segments: [event.point],
        strokeColor: '#ff0000',
        strokeWidth: 5,
    });
}

function onMouseDrag(event) {
    console.log('onMouseDrag');
    $path.add(event.point);
}

function onMouseUp(event) {
    console.log('onMouseUp');
    $path.fullySelected = true;
}

Но события не происходят. Что я упустил? Благодаря.

1 Ответ

0 голосов
/ 04 июня 2019

Вы должны подключить ваши обработчики событий к текущему виду бумаги. 

paper.view.onMouseDown = onMouseDown;
paper.view.onMouseUp = onMouseUp;

посмотреть на: http://paperjs.org/reference/view/

...