Как включить и правильно использовать расширение @ types / cytoscape UI в Angular 7 - PullRequest
0 голосов
/ 12 февраля 2019

Я пытаюсь включить в мой проект Angular7 расширения grid-guide и edgehandles cytoscape.js.Это работает, но не так, как задумано (я думаю), я не могу отключить рисование краев, когда он инициализируется, но не запускается.

cytoscape импортируется с сеткой @ types / cytoscape

-guide: https://github.com/iVis-at-Bilkent/cytoscape.js-grid-guide edgehandles: https://github.com/cytoscape/cytoscape.js-edgehandles

В настоящее время расширения импортируются через npm

Я пытался следить за этой проблемой, опубликованной, но это не помогло мнеfar: Как использовать расширение пользовательского интерфейса для Cytoscape.js в Typescript?

Я пытался использовать пользовательский файл typings.d.ts, который рекомендуется в @ types / cytoscape (см. внизу файла index.d.ts)

typings.d.ts:
declare module 'edgehandles-cyto' {
  const ext: cytoscape.Ext;
  export = ext;
};

And importing into the component:
import cytoscape = require('cytoscape'); //This works


//Importing jquery and grid-guide, works, but maybe not as intended
var jquery = require('jquery');
var gridGuide = require('cytoscape-grid-guide');

//Importing cytoscape extension, edgehandles, works, but not as intended
var edgehandles = require('cytoscape-edgehandles');

//Connected with cytoscape
gridGuide( cytoscape, jquery );
cytoscape.use(edgehandles);

//After cytoscape is initialized, trying to include these extensions
this.cy.gridGuide(options);    //Options and defaults are already set
this.cy.edgehandles(defaults);

Ссылка на проект: https://stackblitz.com/edit/angular-cytoscape

Ожидаемый результат - запуск маркеров с помощью this.cy.edgehandles ('drawon'));

1 Ответ

0 голосов
/ 24 февраля 2019

глупая ошибка мной, но если кто-то борется с этим.Все, что вам нужно сделать, это использовать: '' '// установить переменную для расширения: public eh: any;

....

this.eh = this.cy.edgehandles (по умолчанию);this.eh.disable ();// вместо this.cy.edgehandles ('drawon');'' '

...