JointJS Неинтерактивные элементы

Я хочу отключить перемещение элементов и ссылок в диаграммах JointJS, сохранив при этом другие функции, такие как гиперссылки элементов и выделение ссылки при наведении мыши. Я ссылался на следующие ссылки: https://groups.google.com/forum/#!searchin/jointjs/drag/jointjs/R0KZwKqfRbI/rGLJz3t4Un0J https://groups.google.com/forum/#!searchin/jointjs/read$20only/jointjs/o8CKU6N7EOI/1KGNFCQQHGUJ

Но они мне не помогли. Я пробовал: paper.$el.css('pointer-events', 'none'); Но отключает все. Я хочу отключить только перетаскивание элементов и ссылок


jointjs
person Lahore    schedule 03.06.2014    source источник

Ответы (4)


arrow_upward
16
arrow_downward

Предполагая, что я правильно вас понял, вторая ссылка должна дать вам ответ. Вам просто нужно сделать документ неинтерактивным:

var paper = new joint.dia.Paper({
    el: '#paper',
    width: 500,
    height: 500,
    gridSize: 1,
    graph: new joint.dia.Graph,
    interactive: false
});

Это должно отключить любое перемещение элементов/ссылок/вершин при сохранении функций выделения.

person ckuepker    schedule 12.09.2014

arrow_upward
2
arrow_downward 

paper.$el.css('pointer-events', 'none');

отключит перемещение всего на бумаге. Если вы хотите отключить перемещение определенного элемента, используйте его.

element.attr({rect:{style:{'pointer-events':'none'}}});

Подробнее здесь: Сделать элементы недоступными для выбора в JointJS

person Aung Myat Hein    schedule 08.03.2016

arrow_upward
1
arrow_downward

Я предлагаю получить объект события и использовать собственную логику для отключения/поддержания активности. Как ты это делаешь:

   var b_paperDraggable = false;
   var b_paperPropertise = false;

paper.on('cell:pointerdown', function (cellView) {

    if (b_paperDraggable == true) {
        //...
    }
    if (b_paperPropertise == true) {

        openPropInModal(cellView.model.id, cellView.model.attributes.elmTypeID);
        $("#modal-container").modal();
    }
});
person shdr    schedule 20.04.2017

arrow_upward
0
arrow_downward

Решение для меня - добавить cell.model.attr('./pointer-events','none');, например, вам нужно найти модель:

Например, после создания элемента:

var cell = paper.findViewByModel(graph.getLastCell());
cell.model.attr('./pointer-events','none');
person Omar Duarte    schedule 18.03.2019