大佬教程收集整理的这篇文章主要介绍了如何在Angular 4中添加Google图表,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
createBarChart(element: any): any { return new google.visualization.barChart(element); }@H_262_1@我收到错误“google.visualization.barChart不是构造函数”. @H_262_1@我看到其中一条评论也提到了使用< ng-content>用于数据投影,但没有明确概述. @H_262_1@在尝试提出“好”的问题时,这是我的GoogleChartComponent:
export class GoogleChartComponent implements OnInit { private static googleLoaded: any; constructor() { console.log('Here is GoogleChartComponent'); } getGoogle() { return google; } ngOnInit() { console.log('ngOnInit'); if (!GoogleChartComponent.googleLoaded) { GoogleChartComponent.googleLoaded = true; google.charts.load('current',{ 'packages': ['bar'] }); google.charts.setOnLoadCallBACk(() => this.drawGraph()); } } drawGraph() { console.log('DrawGraph base class!!!! '); } createBarChart(element: any): any { return new google.visualization.barChart(element); } createDataTable(array: anY[]): any { return google.visualization.arrayToDataTable(array); } }@H_262_1@我的子组件扩展了它:
@Component({ SELEctor: 'app-bitcoin-chart',template: ` <div id="barchart_material" style="width: 700px; height: 500px;"></div> `,styles: [] }) export class BitcoinChartComponent extends GoogleChartComponent { private options; private data; private chart; // constructor() { // super(); // console.log('Bitcoin Chart Component'); // } drawGraph() { console.log('Drawing Bitcoin Graph'); this.data = this.createDataTable([ ['Price','Coinbase','Bitfinex','Poloniex','Kraken'],['*',1000,400,200,500] ]); this.options = { chart: { title: 'Bitcoin Price',subtitle: 'Real time price data across exchanges',},bars: 'vertical' // required for Material Bar Charts. }; this.chart = this.createBarChart(document.getElementById('barchart_material')); this.chart.draw(this.data,this.options); } }
google.charts.load('current',{ 'packages': ['corechart'] });@H_262_1@‘bar’包用于Material图表版本
以上是大佬教程为你收集整理的如何在Angular 4中添加Google图表全部内容,希望文章能够帮你解决如何在Angular 4中添加Google图表所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。