Проблема с производительностью в jointjs при программном добавлении нескольких ссылок в граф

Я использую суставы / раппид в нашем веб-приложении. Я заметил проблему с производительностью при программном добавлении нескольких ссылок на мой график. В моем примере я добавляю 45 ссылок на график, на выполнение которых у меня уходит около 3 секунд на моем довольно быстром компьютере.

Что я могу сделать лучше? Как я могу улучшить производительность?

Не имеет значения, как выглядит ссылка - узким местом является функция addCell.

Вот снимок моего графика: (http://www.epro.de/exchange/virtual-reality/jointjs/linkTest.png)

Вот исходный пример:

 var link = new joint.shapes.app.Link({
            router: {
                name: 'manhattan'
            },
            connector: {
                name: 'rounded',
              args: {radius: 10}
            },
            source: {
                id: l_source.id,
                port: sourcePort
            },
            target: {
                id: l_target.id,
                port: targetPort
            },
            attrs: {
                '.marker-target': {
                    d: 'M 10 0 L 0 5 L 10 10 z',
                    stroke: 'transparent',
                    fill: '#222138',
                    transform: 'scale(0.5)' 
                },
                '.connection': {
                    stroke: 'blue',
                    'stroke-dasharray': '0',
                    'stroke-width': 1
                }
            },
           arrowheadMarkup: [
            '<g class="marker-arrowhead-group marker-arrowhead-group-<%= end %>">',
            '<path class="marker-arrowhead" end="<%= end %>" d="M 14 0 L 0 7 L 14 14 z" />',

            '</g>'
          ].join(''),
          toolMarkup: [
            '<g class="link-tool">',
            '<g class="tool-remove" event="remove">',
            '<circle r="8" />',
            '<path transform="scale(.5) translate(-16, -16)" d="M24.778,21.419 19.276,15.917 24.777,10.415 21.949,7.585 16.447,13.087 10.945,7.585 8.117,10.415 13.618,15.917 8.116,21.419 10.946,24.248 16.447,18.746 21.948,24.248z" />',
            '<title>Remove link.</title>',

            '</g>',

            '</g>'
          ].join(''),
        });

    l_graph.addCell (link);

Спасибо Дитер

0
0
330
1

Ответы 1

Я нашел решение. Сначала я собираю все ячейки и ссылки в массив, а затем делаю следующее: graph.resetCells (allElementArray);

Затем я устанавливаю отсутствующий атрибут z для всех элементов в порядке возрастания. Это уменьшило время загрузки с 3 до 0,4 с.

Другие вопросы по теме