zoukankan      html  css  js  c++  java
  • [D3 + AngularJS] 15. Create a D3 Chart as an Angular Directive

    Integrating D3 with Angular can be very simple. In this lesson, you will learn basic integration as well as how to create D3 charts that can be packaged as AngularJS directives.

    <!DOCTYPE html>
    <html ng-app="app">
    <head lang="en">
      <meta charset="UTF-8">
      <title></title>
    </head>
    <body>
    
    <div ng-view></div>
    
    <!-- AngularJS Partial Template Start -->  
    <script type="text/ng-template" id="chartTpl">
      <button ng-click="setSubject('math')">Math</button>
      <button ng-click="setSubject('science')">Science</button>
      <button ng-click="setSubject('reading')">Reading</button>
    
      <div area-chart class="area-chart" chart-data="chartData"></div>
    </script>
    <!-- AngularJS Partial Template End -->  
    
    <script src="//cdnjs.cloudflare.com/ajax/libs/d3/3.5.3/d3.min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/lodash.js/2.4.1/lodash.min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.15/angular.min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.15/angular-route.min.js"></script>
    
    </body>
    </html>
  • 相关阅读:
    CF763C Timofey and Remoduling
    CF762E Radio Stations
    CF762D Maximum Path
    CF763B Timofey and Rectangles
    URAL1696 Salary for Robots
    uva10884 Persephone
    LA4273 Post Offices
    SCU3037 Painting the Balls
    poj3375 Network Connection
    Golang zip压缩文件读写操作
  • 原文地址:https://www.cnblogs.com/Answer1215/p/4559639.html
Copyright © 2011-2022 走看看