ThreeJS DragControls в Angular5

Question

Я пытаюсь настроить 3js в проекте angular5 (angular-cli).Обычный ThreeJS прекрасно работает, просто установив

 npm install three and npm install @types/three;

Но я не могу найти способ использовать элементы управления, которые существуют в трех / examples / js / controls / DragControls.js

Iпопытался выполнить следующие действия:

• npm и установить три-dragcontrols.Это не импортирует DragControls, и объект всегда неопределен/ examples / js / controls в теге .angular-cli scripts.Но комплект сценариев js включен в комплект поставки поставщика, который включает в себя ThreeJS.

• попытался скопировать элементы управления в папку assets в качестве тегов сценария на html-странице, но объект окна THREE не определен и, следовательно,не работает.

• единственная опция, которую я вижу сейчас, это проверить код как исходный код и преобразовать его в машинописный текст (переименовать файл и исправить проблемы с линтингом и т. д.)

Как правильно включить DragControls / MapControls и т. Д. В приложение Angular?

Answer 1

В Node вы можете легко конвертировать большинство библиотек в модули, вы не ограничены репозиторием NPM.Перейдите к файлу DragControls и добавьте следующую строку поверх всего остального:

module.exports = function(){

   <library-code>...</library-code>

};
module.exports();

Примечание: код библиотеки просто для того, чтобы привлечь ваше внимание, вам просто нужно поставить JavaScriptкод этой библиотеки в function () {}; скобках, назначенных module.exports и вызывающих его в конце кода, как в примере выше.

Например,для CanvasJS не было модуля NPM, который я мог бы использовать.Поэтому я превратил его в модуль.Не забудьте пакет.json, который вам нужен, в противном случае для Node модулей не будет.

Оттуда вы сможете () потребовать его.Если вы хотите использовать его где-либо, создайте сервис Angular и укажите () его в этом файле.

Убедитесь сами в следующем: https://github.com/Nchaka/-Kinaxis/blob/konkret/node_modules/canvasjs/canvasjs.min.js

Если это поможет вам учиться с помощьюДля сравнения, не-Node-версию этого же приложения можно найти по следующей ссылке, используя немодульную версию CanvasJS: https://github.com/Nchaka/Kinaxis