You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@echarts.apache.org by GitBox <gi...@apache.org> on 2019/04/08 14:32:54 UTC
[GitHub] [incubator-echarts] shivamsriva31093 edited a comment on issue
#10153: Y Axis values are displayed but the graph does not appear
shivamsriva31093 edited a comment on issue #10153: Y Axis values are displayed but the graph does not appear
URL: https://github.com/apache/incubator-echarts/issues/10153#issuecomment-480856962
I tried using the un-minified version of echarts, but still getting the same error in console in the production build. I downloaded the js file, created one directive and followed the starter tutorial https://ecomfe.github.io/echarts-doc/public/en/tutorial.html#Get%20Started%20with%20ECharts%20in%205%20minutes
```
import {
Directive, ElementRef, Input, OnInit, HostBinding, OnChanges, OnDestroy
} from '@angular/core';
import { Subject, Subscription } from 'rxjs';
import * as echarts from '../../../assets/echarts.js';
// import ECharts = echarts.ECharts;
// import EChartOption = echarts.EChartOption;
import { distinctUntilChanged } from 'rxjs/operators';
@Directive({
selector: '[ts-chart]',
})
export class EchartsDirective implements OnChanges, OnInit, OnDestroy {
@Input('ts-chart') public options: any;
@HostBinding('style.height.px')
public elHeight: number;
private chart: any;
private sizeCheckInterval = null;
private reSize$ = new Subject<string>();
private onResize: Subscription;
constructor(private el: ElementRef) {
this.chart = echarts.init(this.el.nativeElement, 'vintage');
}
public ngOnChanges(changes) {
if (this.options) {
this.chart.setOption(this.options);
}
}
public ngOnInit() {
this.sizeCheckInterval = setInterval(() => {
this.reSize$.next(`${this.el.nativeElement.offsetWidth}:${this.el.nativeElement.offsetHeight}`);
}, 100);
this.onResize = this.reSize$.pipe(distinctUntilChanged())
.subscribe((_) => this.chart.resize());
this.elHeight = this.el.nativeElement.offsetHeight;
if (this.elHeight < 300) {
this.elHeight = 300;
}
}
public ngOnDestroy() {
if (this.sizeCheckInterval) {
clearInterval(this.sizeCheckInterval);
}
this.reSize$.complete();
if (this.onResize) {
this.onResize.unsubscribe();
}
}
}
```
the echarts file I also tried using the one generated in dist folder of this project.
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
With regards,
Apache Git Services
---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@echarts.apache.org
For additional commands, e-mail: dev-help@echarts.apache.org