Необходимо отобразить событие "click", чтобы оно действовало как всплывающее окно EditNode без кнопки сохранения и отмены.Только чтобы показать Nodepopup / edgepopup - PullRequest
Новая
       12

Необходимо отобразить событие "click", чтобы оно действовало как всплывающее окно EditNode без кнопки сохранения и отмены.Только чтобы показать Nodepopup / edgepopup

0 голосов
/ 16 октября 2018

У меня есть рабочий код из приведенного ниже примера.

http://visjs.org/examples/network/other/manipulationEditEdgeNoDrag.html

Но я хотел бы добавить событие "click", чтобы отобразить свойства узла (NodePopUp) и свойства ребра.

Поэтому, когда я щелкаю узел, должен отображаться NodePopUp без кнопки сохранения и отмены.То же самое для EdgePopup тоже.

Левое изображение - щелкнул по узлу 0. Но я должен нажать «Изменить» -> «Редактировать узел» ->, а затем отобразить всплывающее окно свойств узла.

Я хотел бы пропустить эти шаги, и когда ящелкните узел / ребро, соответствующее всплывающее окно узла / ребра должно отображаться без кнопки сохранения и отмены.

enter image description here Может кто-нибудь дать мне предложение для достижения этой цели?

1 Ответ

0 голосов
/ 17 октября 2018

В основном вам нужно обработать click событие (network.on("click", ...)) и открыть всплывающее окно (если вы выберете код приведенного примера, вы увидите, что это делается с помощью editNode помощник, а также присваивая document.getElementById('node-operation').innerHTML = "Add Node";; я должен признать, что код там не очень многократно используется, вы можете взглянуть на мою реализацию графического редактора, см. config.macros.graph.createEditPopup помощникМногоразовее для таких вещей).Так что будет что-то вроде 

network.on("click", function(clickProperties)
{
    var popup = document.querySelector('.my_popup'); // adjust selector to the class/id you use

    if(clickProperties.nodes.length == 1) // you want this for just one node clicked, right?
    {
        var id = clickProperties.nodes[0];

        popup.style.display = 'block';
        popup.textContent = 'one node selected: '+id; // fill popup input fields etc
    }
    else if(clickProperties.nodes.length == 0)
    {
        popup.style.display = 'none';
    }
})

(посмотрите, как это работает с помощью только div вместо всплывающего окна ). Вам также нужно будет обрабатывать скрытие и отображение кнопок сохранения / отмены, добавляя / удаляяdisplay: none; CSS к элементам;или, что еще лучше, вы можете каждый раз воссоздавать всплывающее окно, чтобы не связываться с ними.Вы также должны решить, как вы собираетесь закрыть всплывающее окно (вы можете пропустить скрытие «отмена» или заменить его крестовой кнопкой или закрыть при нажатии клавиши esc или при нажатии в другом месте ...)

...