index.d.ts, found version 4, expected 3.. and Cannot read property 'length' of undefined at LineChartComponen

trying to implementing <ngx-charts-line-chart> but getting this error:

ERROR in Metadata version mismatch for module C:/Users/Pawel/desktop/code/pami/node_modules/@swimlane/ngx-charts/release /index.d.ts, found version 4, expected 3, resolving symbol AppModule in C:/Users/Pawel/desktop/code/pami/src/app/app.mod ule.ts, resolving symbol AppModule in C:/Users/Pawel/desktop/code/pami/src/app/app.module.ts

as well ass:

TypeError: Cannot read property ‘length’ of undefined at LineChartComponent…/src/line-chart/line-chart.component.ts.LineChartComponent.getXDomain…

package.json:

> `{
>   "name": "pami",
>   "version": "0.0.0",
>   "license": "MIT",
>   "scripts": {
>     "ng": "ng",
>     "start": "ng serve",
>     "build": "ng build",
>     "test": "ng test",
>     "lint": "ng lint",
>     "e2e": "ng e2e"
>   },
>   "private": true,
>   "dependencies": {
>     "@angular/animations": "^5.0.2",
>     "@angular/common": "^4.0.0",
>     "@angular/compiler": "^4.0.0",
>     "@angular/core": "^4.0.0",
>     "@angular/forms": "^4.0.0",
>     "@angular/http": "^4.0.0",
>     "@angular/platform-browser": "^4.0.0",
>     "@angular/platform-browser-dynamic": "^4.0.0",
>     "@angular/router": "^4.0.0",
>     "@firebase/webchannel-wrapper": "0.2.3",
>     "@ng-bootstrap/ng-bootstrap": "^1.0.0-beta.5",
>     "@swimlane/ngx-charts": "^7.0.0",
>     "angularfire2": "^5.0.0-rc.2",
>     "bootstrap": "^4.0.0-alpha.6",
>     "bootswatch": "^4.0.0-beta.2",
>     "core-js": "^2.4.1",
>     "d3": "^4.11.0",
>     "firebase": "^4.5.0",
>     "font-awesome": "^4.7.0",
>     "ng-sidebar": "^6.0.2",
>     "promise-polyfill": "6.0.2",
>     "rxjs": "^5.1.0",
>     "zone.js": "^0.8.4"
>   },
>   "devDependencies": {
>     "@angular/cli": "1.0.1",
>     "@angular/compiler-cli": "^4.0.0",
>     "@types/jasmine": "2.5.38",
>     "@types/node": "~6.0.60",
>     "codelyzer": "~2.0.0",
>     "jasmine-core": "~2.5.2",
>     "jasmine-spec-reporter": "~3.2.0",
>     "karma": "~1.4.1",
>     "karma-chrome-launcher": "~2.0.0",
>     "karma-cli": "~1.0.1",
>     "karma-jasmine": "~1.1.0",
>     "karma-jasmine-html-reporter": "^0.2.2",
>     "karma-coverage-istanbul-reporter": "^0.2.0",
>     "protractor": "~5.1.0",
>     "ts-node": "~2.0.0",
>     "tslint": "~4.5.0",
>     "typescript": "~2.2.0"
>   }
> }
> `

[ghost]

My error was:

ERROR in Error: Metadata version mismatch for module C:/temp/chartsTest/something/node_modules/@swimlane/ngx-charts/release/index.d.ts, found version 4, expected 3, resolving symbol AppModule in C:/temp/chartsTest/something/src/app/app.module.ts, resolving symbol AppModule in C:/temp/chartsTest/something/src/app/app.module.ts

at syntaxError (C:\temp\chartsTest\something\node_modules\@angular\compiler\bundles\compiler.umd.js:1729:34)
at simplifyInContext (C:\temp\chartsTest\something\node_modules\@angular\compiler\bundles\compiler.umd.js:24979:23)
at StaticReflector.simplify (C:\temp\chartsTest\something\node_modules\@angular\compiler\bundles\compiler.umd.js:24991:13)
at StaticReflector.annotations (C:\temp\chartsTest\something\node_modules\@angular\compiler\bundles\compiler.umd.js:24418:41)
at _getNgModuleMetadata (C:\temp\chartsTest\something\node_modules\@angular\compiler-cli\src\ngtools_impl.js:138:31)
at _extractLazyRoutesFromStaticModule (C:\temp\chartsTest\something\node_modules\@angular\compiler-cli\src\ngtools_impl.js:109:26)
at Object.listLazyRoutesOfModule (C:\temp\chartsTest\something\node_modules\@angular\compiler-cli\src\ngtools_impl.js:53:22)
at Function.NgTools_InternalApi_NG_2.listLazyRoutes (C:\temp\chartsTest\something\node_modules\@angular\compiler-cli\src\ngtools_api.js:91:39)
at AotPlugin._getLazyRoutesFromNgtools (C:\temp\chartsTest\something\node_modules\@ngtools\webpack\src\plugin.js:212:44)
at _donePromise.Promise.resolve.then.then.then.then.then (C:\temp\chartsTest\something\node_modules\@ngtools\webpack\src\plugin.js:448:24)
at <anonymous>
at process._tickCallback (internal/process/next_tick.js:188:7)

[GaetanWi]

@neo-xy I’m using Angular 4.0.2, and I needed to use ngx-charts in it’s 6.0.2 version to avoid this mismatch error. 6.1.0 seems to be for Angular 4.3 and higher and 7.0.0 seems to be for Angular 5.0

The undefined errormight be code related issue on your side sending the wrong data to the chart. For this chart, the library expect a multi data sample and not a simple one as you can see here : https://swimlane.gitbooks.io/ngx-charts/content/charts/line-chart.html