Question

我在我的应用程序中使用角度分量尝试过角度规j ..但是它没有工作......

标尺字符为https://www.amcharts.com/demos/animated-gauge/

我的代码如下：

    (function(app) {
    'use strict';
    SpeedometerController.$inject = ['$scope', '$timeout','$http', 'apiurl'];
    function SpeedometerController($scope, $timeout,$http, apiurl) {

        var initChart = function () {


             $scope.amChartOptions = { 
              "type": "gauge",
            //  "theme": "none",
              "axes": [ {
                "axisThickness": 0,
                "axisAlpha": 0.2,
                "tickAlpha": 0.2,
                "valueInterval": 500,   
                "inside": false,
                "fontSize": 11,
                // "labelOffset": -50,
                "gridInside": true,
                "startAngle": -90,
                "endAngle": 90,
                "bands": [ {
                  "color": "#91c039",
                  "endValue": 500,
                  "innerRadius": "78%",
                  "startValue": 0
                }, {
                  "color": "#f0cf1b",
                  "endValue": 1000,
                  "innerRadius": "88%",
                  "startValue": 500
                },{
                  "color": "#de7c13",
                  "endValue": 1500,
                  "innerRadius": "88%",
                  "startValue": 1000
                }, {
                  "color": "#c53020",
                  "endValue": 2000,
                  "innerRadius": "88%",
                  "startValue": 1500
                } ],
                "topText": "497",
                "topTextYOffset": 105,
                "topTextColor": "#555555",
                "topTextFontSize": 50,  
                "bottomText": "Watts",
                "bottomTextYOffset": -10,
                "bottomTextColor": "#909090",
                "bottomTextFontSize": 18,
                "endValue": 2000
              } ],
              "arrows": [
                {
                  "startWidth" : 15,
                  "nailBorderThickness" : 1,
                  "nailRadius" : 8 ,
                  "color" : "#5b5b5b",
                }
              ],
              "export": {
                "enabled": true
              }
            };
        };    
            initChart();  

        AmCharts.ready(function () {
            initChart();
         });   
    }
    app.module('app').component('speedometer', {
        templateUrl: '../resources/views/component/speedometer.html',
        controller: SpeedometerController
    });
})(window.angular);

<div id="speeda_meter"></div>

那有什么问题？

Answer 1

最好使用以角度为基础的库作为任何角度应用的基础。在角度内包装jQuery应该被认为是最后一个选项。如果您打开尝试不同的规格，我发布了Angular JS应用程序的开源Gauge指令库Angular Gauge。结帐，如果它符合您的目的。

Angularjs测量js如何穿上角度分量

1 个答案: