2017-01-28 45 views
1

我想獲取圖表區域上onclick的x和y軸的值。至於現在我做:如何在單擊Angular JS圖表上獲取x和y軸?

HTML:

<script data-require="[email protected]" src="http://code.angularjs.org/1.2.2/angular.js" data-semver="1.2.2"></script> 
<script data-require="[email protected]*" data-semver="3.3.11" src="//cdnjs.cloudflare.com/ajax/libs/d3/3.3.11/d3.js"></script> 
<script type="text/javascript" src="https://rawgit.com/chinmaymk/angular-charts/bower/dist/angular-charts.min.js"></script> 

<div ac-chart="'area'" ac-data="barData" ac-config="config" id='chart2' class='chart' style="width: 100%"></div> 

JS:

$scope.config = { 
         title: 'Customer Distribution', 
         tooltips: true, 
         labels: false, 
         mouseover: function() { 
         }, 
         mouseout: function() { 
         }, 
         click: function (d) { 
          console.log(d); 
          console.log(angular.toJson(d)); 
         }, 
         isAnimate: true, 
         waitForHeightAndWidth: false, 
         legend: { 
          display: true, 
          //could be 'left, right' 
          position: 'right', 
          htmlEnabled: false 

         } 
        }; 


        var sin = []; 

        if (angular.equals(bin, "UNIT")) { 
         angular.forEach(data, function (item) { 
          var y = []; 
          y.push(item.customerListSize); 
          sin.push({x: item.value, y: y}); 
         }); 
        } else { 
         angular.forEach(data, function (item) { 
          var y = []; 
          y.push(item.totalBinSize); 
          sin.push({x: item.binName, y: y}); 
         }); 
        } 

        $scope.barData = { 
         series: [featureType], 
         data: sin 
        }; 

中的圖表顯示了正確的,但我想在點擊添加一些功能?我需要點擊圖表時獲取圖表的x和y值,以便我可以將它添加到工具提示中,並使用該值調用其他方法。有人能告訴我如何獲得點擊值。點擊時我試圖打印控制檯,只顯示屏幕位置。

回答

0

使用此:

click: function(d) { 
    console.log(d); 
}, 

d將在該對象的datum點擊。

+0

試過,但d有屏幕位置。 – user3407267

+0

@ user3407267,你是對的,我的道歉。你是否想要click的x,y位置被點擊的x,y值? – Mark

相關問題