2017-04-22 110 views
0

我正在使用anuglar-nvd3,并且找不到API上的任何文档。我现在面临的问题是如何在xAxis和yAxis上设置最大值&最小值。在轴上设置最小值和最大值

换句话说,无论数据,轴将有一个最低的-1和1最大

Plunker的:http://plnkr.co/edit/LKt3UJe5PnJOf8uQEwxr?p=preview

代码:

var app = angular.module('plunker', ['nvd3']); 

app.controller('MainCtrl', function($scope) { 
$scope.options = { 
      chart: { 
       type: 'scatterChart', 
       height: 450, 
       color: d3.scale.category10().range(), 
       scatter: { 
        onlyCircles: false 
       }, 
       showDistX: true, 
       showDistY: true, 
       tooltipContent: function(key) { 
        return '<h3>' + key + '</h3>'; 
       }, 
       duration: 350, 
       xAxis: { 
        scale: [0,5], 
        axisLabel: 'X Axis', 
        tickFormat: function(d){ 
         return d3.format('.02f')(d); 
        } 
       }, 
       yAxis: { 
        axisLabel: 'Y Axis', 
        tickFormat: function(d){ 
         return d3.format('.02f')(d); 
        }, 
        axisLabelDistance: -5 
       }, 
       zoom: { 
        //NOTE: All attributes below are optional 
        enabled: false, 
        scaleExtent: [1, 10], 
        useFixedDomain: false, 
        useNiceScale: false, 
        horizontalOff: false, 
        verticalOff: false, 
        unzoomEventType: 'dblclick.zoom' 
       }, 
       margin: { 
        top: 100, 
        right: 100, 
        left: 100, 
        bottom: 100 
       } 
      } 
     }; 

     $scope.data = [ 
     { 
      "key":"static", 
      "color":"#fff", 
      "values":[ 
      { 
       "x":-1, 
       "y":-1, 
       "size":0.0000001, 
       "shape":"circle", 
       "series":0 
      }, 
      { 
       "x":1, 
       "y":1, 
       "size":0.0000001, 
       "shape":"circle", 
       "series":0 
      } 
      ] 
     }, 
     { 
      "key":"Group 0", 
      "color":"#1f77b4", 
      "values":[ 
      { 
       "x":-0.5, 
       "y":-0.5, 
       "size":0.5, 
       "shape":"circle", 
       "series":0 
      } 
      ] 
     }, 
     { 
      "key":"Group 1", 
      "color":"#ff7f0e", 
      "values":[ 
      { 
       "x":-0.5, 
       "y":0.5, 
       "size":0.5, 
       "shape":"circle", 
       "series":0 
      } 
      ] 
     }, 
     { 
      "key":"Group 2", 
      "color":"#2ca02c", 
      "values":[ 
      { 
       "x":0.5, 
       "y":-0.5, 
       "size":0.5, 
       "shape":"circle", 
       "series":0 
      } 
      ] 
     }, 
     { 
      "key":"Group 3", 
      "color":"#d62728", 
      "values":[ 
      { 
       "x":0.5, 
       "y":0.5, 
       "size":0.5, 
       "shape":"circle", 
       "series":0 
      } 
      ] 
     } 
    ]; 

}); 

回答

0

你试过

forceY: [-1, 1], 
forceX: [-1, 1], 
+0

工作表示感谢。网上有我可以遵循的任何文档吗? –

+0

只需查看NVD3文档。 https://nvd3-community.github.io/nvd3/examples/documentation.html Angular NVD3将函数调用转换为配置选项。 – jeznag

相关问题