1
각도 2 애플리케이션에서 C3.js 차트를 구현했지만 C3.css 파일의 스타일이 적용되지 않았습니다. 나는 그것이 (모든 이벤트가 내 구성 요소의 scss 파일로 복사되는)로드 중이지만 여전히 작동하지 않는다는 것을 안다. 그것은 CSS 이후에 차트가로드되기 때문입니까? 누구든지이 문제를 해결하는 방법을 알고 있습니까?각도 2 앱의 C3.js 차트에 CSS가 적용되지 않았습니다.
ngOnInit에서 차트의 데이터를 비동기 적으로 가져 오므로 차트가 그려지기 전에 CSS가 적용됩니다 (데이터 수신시 발생). 나는 또한 그것이 앵귤러 선택자를 던지면서 뭔가있을 수 있다고 생각하고 있습니다.
ngOnInit() {
// draw pie chart
this.bitcoinService.getMapData()
.subscribe(data => {
var pieChartData = this.formatPieChartData(data);
this.pieChartInit(pieChartData); // call this.pieChartInit
})
}
pieChartInit(data) {
var chart = c3.generate({
data: {
columns: data, // example: [['data1', 30], ['data2', 120]]
type: 'pie'
}
});
나는 바로 내 구성 요소의 다른 모든 것들에 대한 어떤 작품이 같이 포함되어 내 SCS들에 C3의 CSS를 복사 :
@Component({
moduleId: module.id,
selector: 'bitcoin-dashboard',
styles: [require('./bitcoin-dashboard.component.scss')],
template: require('./bitcoin-dashboard.component.html')
})
, 나는 차트의 요소 후를 d3.select 때 pieChartInit가 호출되면 스타일이 적용됩니다. 예 :
d3.selectAll('.c3-chart-arc path').style('stroke', 'white')
어떤 도움을 주시면 감사하겠습니다!
을 수 지금까지 시도한 것을 보여주는 몇 가지 코드를 추가하십시오. –
@georgej 내 상세한 답변보기 : http://stackoverflow.com/a/42189051/704894 –