Question

我似乎无法让amCharts尊重dragIcon上的ChartScrollbar属性。我有a plunk here来证明这个问题。

我怀疑这是GrantMStevens amChartsDirective的一个问题，因为我之前遇到的问题是没有正确传递属性以及it works in this demo这一事实。前一个是由xorspark调试的，我能够复制他的调试，但这并没有以同样的方式被破坏。不幸的是，我还没有足够的调试JavaScript来跟踪这个问题。

任何人都有任何想法？

  'use strict';
    angular.module('App')
    .controller('MyChartController', ['$scope', function($scope) {
        $scope.data = {};

        $scope.amChartOptions = {
        type: "serial",
        creditsPosition: "upper-left",

        categoryField: "IncidentId",
        rotate: true,
        theme: "light",
        categoryAxis: {
            parseDates: false,
            gridAlpha: 0.3,
            gridColor: "#d3d3d3"
        },
        trendLines: [],
        pathToImages: "http://cdn.amcharts.com/lib/3/images/",
        chartScrollbar: {
            oppositeAxis: true,
            autoGridCount: true,
            graph: "AmGraph-1",
            scrollbarHeight: 65,
            dragIcon: "dragIconRoundSmall",
            dragIconHeight: 65,
            backgroundColor: "#000",
            //color: "#000",
            backgroundAlpha: .5,
            selectedBackgroundColor: "#337ab7",
            svgIcons: true
        },
        graphs: [{
            fillColorsField: "lineColor",
            lineColorField: "lineColor",
            balloonText: "[[title]] for [[category]]: [[value]]",
            fillAlphas: 1,
            id: "AmGraph-1",
            title: "Escalation Age",
            type: "column",
            valueField: "Age"
        }],
        guides: [],
        valueAxes: [{
            baseValue: 0,
            id: "ValueAxis-1",
            labelFrequency: 1,
            dateFormats: [],
            title: "Days Active",
            autoGridCount: true,
            gridAlpha: 0.3,
            gridColor: "#d3d3d3",
        }],
        allLabels: [],
        balloon: {},
        legend: {
            enabled: false
        },
        titles: [{
            id: "Title-1",
            size: 15,
            text: ""
        }],
        data: [
            {
            "lineColor": "#ff0000",
            "IncidentId": 93528214,
            "Age": 19
        },{
            "lineColor": "#ff0000",
            "IncidentId": 93434314,
            "Age": 16
        },{
            "lineColor": "#ff0000",
            "IncidentId": 93524544,
            "Age": 12
        },{
            "lineColor": "#ff0000",
            "IncidentId": 93525454,
            "Age": 10
        },{
            "lineColor": "#ff0000",
            "IncidentId": 96578214,
            "Age": 4
        },{
            "lineColor": "#ff0000",
            "IncidentId": 93334519,
            "Age": 2
        }]
        }
    }]);

Answer 1

cdnjs上旧的3.13.0版AmCharts不支持更改dragIcon。您需要使用更新版本。最新版本的AmCharts库可以在AmCharts自己的CDN上找到：

  <script src="https://www.amcharts.com/lib/3/amcharts.js"></script>
  <script src="https://www.amcharts.com/lib/3/serial.js"></script>
  <script src="https://www.amcharts.com/lib/3/themes/light.js"></script>
  <script src="https://https://www.amcharts.com/lib/3/themes/chalk.js"></script>
  <script src="https://https://www.amcharts.com/lib/3/themes/black.js"></script>
  <script src="https://https://www.amcharts.com/lib/3/themes/dark.js"></script>

更新了plunk：https://plnkr.co/edit/mw4f2FWiTsFkOdjd3tkE?p=preview

amCharts angular指令无法更改ChartScrollbar的拖动句柄

1 个答案: