我想显示this particular display diagram from GoJS(Radial Layout)
我试图将页面上提到的Javascript示例转换为Typescript。
代码段位于:PasteBin for brewity
问题如下:
导入以下内容时,所谓的RadialLayout
属性不存在:
import * as go from 'gojs';
:
$(go.RadialLayout, {... // RadialLayout does not exist for me
我有node_modules/
文件夹中的包,特定文件(RadialLayout.js
)位于:
--- node_modules/
-- gojs/
-- extensions/
- RadialLayout.js
RadialLayout.js
的整个代码是here
我尝试过使用我尝试添加的systemjs.config.js
文件:
map: {
'app': 'app',
'@angular/core': 'npm:@angular/core/bundles/core.umd.js',
'@angular/common': 'npm:@angular/common/bundles/common.umd.js',
'@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js',
'@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js',
'@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
'@angular/http': 'npm:@angular/http/bundles/http.umd.js',
'@angular/router': 'npm:@angular/router/bundles/router.umd.js',
'@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js',
'rxjs': 'npm:rxjs',
'angular-in-memory-web-api': 'npm:angular-in-memory-web-api/bundles/in-memory-web-api.umd.js',
'@ng-bootstrap/ng-bootstrap': 'npm:@ng-bootstrap/ng-bootstrap/bundles/ng-bootstrap.js',
'ng2-cookies': 'npm:ng2-cookies/cookie.js',
'gojs': 'npm:gojs/release/go.js',
_here_-->'radiallayout': 'npm:gojs/extensions/RadialLayout.js'
},
所以在组件文件中我可以这样:
import { RadialLayout } from 'radiallayout';
就像gojs
或rxjs
模块一样。但我没有成功呢?
解决这个问题的方法是什么?
GoJS 的作者对于如何在TypeScript(Angular)框架中使用他的工作的想法较少。我在论坛上问过他。
package.json
档案{
"name": "angular-nimble",
"version": "1.0.0",
"description": "NIMBLE front-end",
"scripts": {
"build": "tsc -p src/",
"build:watch": "tsc -p src/ -w",
"build:e2e": "tsc -p e2e/",
"serve": "lite-server -c=bs-config.json",
"serve:e2e": "lite-server -c=bs-config.e2e.json",
"prestart": "npm run build",
"start": "concurrently \"npm run build:watch\" \"npm run serve\"",
"pree2e": "npm run build:e2e",
"e2e": "concurrently \"npm run serve:e2e\" \"npm run protractor\" --kill-others --success first",
"preprotractor": "webdriver-manager update",
"protractor": "protractor protractor.config.js",
"pretest": "npm run build",
"test": "concurrently \"npm run build:watch\" \"karma start karma.conf.js\"",
"pretest:once": "npm run build",
"test:once": "karma start karma.conf.js --single-run",
"lint": "tslint ./src/**/*.ts -t verbose",
"i18n": "./node_modules/.bin/ng-xi18n -p ./src/tsconfig.json"
},
"keywords": [],
"author": "",
"license": "Apache License 2.0",
"dependencies": {
"@angular/common": "2.4.0",
"@angular/compiler": "2.4.0",
"@angular/compiler-cli": "2.4.0",
"@angular/core": "2.4.0",
"@angular/forms": "2.4.0",
"@angular/http": "2.4.0",
"@angular/platform-browser": "2.4.0",
"@angular/platform-browser-dynamic": "2.4.0",
"@angular/platform-server": "2.4.0",
"@angular/router": "3.4.0",
"@ng-bootstrap/ng-bootstrap": "1.0.0-alpha.21",
"angular-in-memory-web-api": "0.2.4",
"core-js": "2.4.1",
"gojs": "^1.7.12",
"ng2-cookies": "1.0.10",
"rxjs": "5.0.1",
"systemjs": "0.20.11",
"zone.js": "0.7.4"
},
"devDependencies": {
"concurrently": "3.2.0",
"lite-server": "2.2.2",
"typescript": "2.0.10",
"canonical-path": "0.0.2",
"tslint": "3.15.1",
"lodash": "4.16.4",
"jasmine-core": "2.4.1",
"karma": "1.3.0",
"karma-chrome-launcher": "2.0.0",
"karma-cli": "1.0.1",
"karma-jasmine": "1.0.2",
"karma-jasmine-html-reporter": "0.2.2",
"protractor": "4.0.14",
"rimraf": "2.5.4",
"@types/node": "6.0.46",
"@types/jasmine": "2.5.36"
},
"repository": {}
}
答案 0 :(得分:0)
在花费大量时间尝试使用Javascript模块之后,主开发人员共享了RadialLayout
的粗略打字稿文件。论坛上的链接有zip file。
注意强>: 对于参考This GitHub Repo可以使用。