combo-chart error - Can't bind to 'xScale' since it isn't a known property of ':svg:g'

I’m submitting a … (check one with “x”)

[x] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here

Current behavior

importing combo-chart demo into my @angular/cli project Expected behavior

browser console logs error: Can’t bind to ‘xScale’ since it isn’t a known property of ‘:svg:g’.

Reproduction of the problem

What is the motivation / use case for changing the behavior?

seems like something is missing in the setup instructions for @swimlane/ngx-charts

Please tell us about your environment:

OSX, ATOM, chrome Version 59.0.3071.115

• ngx-charts version: x.x.x

@swimlane/ngx-charts v 6.0.0

• Angular version: 2.x.x

@angular/cli 1.2.0 @angular/core 4.0.0

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

chrome, safari, firefox

• Language: [all | TypeScript X.X | ES6/7 | ES5] typescript 2.2.0, es5

[grimace]

I finally got it to work, after hours of playing with it. Eventually by copying one thing after another from the demo project until I was able to get rid of the errors. The difficulty, IMHO, arises from the complexity of the demo and, from a novice’s perspective, not knowing what fields or components are fundamentally required by a particular component. I had a similar, follow on experience with the bubble-chart, where after several hours found the right combination of things to get it to display.

The whole purpose of my exercise was to display shapes (pointers, squares, circles) on top of a multi-line graph, where the shapes coincide with X-Axis coordinates. From what I’ve read, the best approach is to build my own ( similar to combo-chart ) and modify that accordingly, by combining the line-chart with the bubble-chart and modifying the bubble chart to display things besides circles…

I would like to turn this into a feature request of: ‘having simple demos’ of the individual components that spell out exactly what things are required for a particular component.

I love the demo, but my head hurts trying to extract the things I need. That being said, thx for the great work!

[tbiggs]

Since at least 4 of us have run into this, I thought I’d post the solution. When you are creating the components in your own project, make sure you create both: ComboChartComponent and ComboSeriesVerticalComponent. I wrongly assumed the ComboSeriesVerticalComponent was something I didn’t need (thinking it was just a different version of the same thing).