我如何使用角js进入谷歌排行榜

I want to customize the bar chart with the user's data, and redraw it accordingly on run time. user should give details on both axis and their values. What code i should write to it ? Can angular variables be a good choice for doing it ?

我想使用用户的数据自定义条形图,并在运行时相应地重绘它。用户应提供有关轴及其值的详细信息。我应该写什么代码?角度变量可以是一个很好的选择吗?

<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
  google.load("visualization", "1", {packages:["corechart"]});
  google.setOnLoadCallback(drawChart);
  function drawChart() {
    var data = google.visualization.arrayToDataTable([
      ['Year', 'Sales', 'Expenses'],
      ['2004',  600,      400],
      ['2005',  1170,      460],
      ['2006',  660,       1120],
      ['2007',  1030,      540]
      ['2008',  2000,      250]
    ]);

    var options = {
      title: 'Company Performance',
      vAxis: {title: 'Year',  titleTextStyle: {color: 'blue'}}
    };

    var chart = new google.visualization.BarChart(document.getElementById('div1'));

    chart.draw(data, options);
  }
</script>

2 个解决方案

#1

Take a look at AngularJs Google Chart Tools directive

看一下AngularJs Google Chart Tools指令

If you want to do things the "Angular way" you should use directives for all of your DOM manipulation. So i suggest you to store all of your data inside a controller, and then in your view use a directive to render a view from your data

如果你想以“Angular方式”做事,你应该使用指令进行所有DOM操作。因此,我建议您将所有数据存储在控制器中,然后在视图中使用指令从数据中呈现视图

#2

Go through this Google chart tools AngularJs Directive

浏览此Google图表工具AngularJs指令

#1