2016-03-31 8 views
1

Kann mir jemand sagen, wie man eine Farbe oder CSS-Klasse für die y-Achse eines angular-nvd3 lineChart angeben?angular-nvd3 Liniendiagramm Farbe der Achse ändern

Ich habe unter Angabe der Optionen:

<nvd3 options="lineChartOptions" data="graphData" ></nvd3>

und dann in einem Objekt alle Möglichkeiten:

$scope.lineChartOptions = { 
        chart: { 
         type: 'lineChart', 
         showLegend:false, 
         forceY:[0,5], // make y axis start at 0 to 5 
         forceX:[1,4], 
         // interpolate:"monotone", 
         height: 400, 
         width: 600, 
         margin : { 
          top: 20, 
          right: 20, 
          bottom: 40, 
          left: 55 
         }, 
         x: function(d){ return d.x; }, 
         y: function(d){ return d.y; }, 
         useInteractiveGuideline: true, 
         tooltip: { 
          contentGenerator: function(d) { return '<h3>HELLO WORLD</h3>'; } 
         }, 
         dispatch: { 
          stateChange: function(e){ console.log("stateChange"); }, 
          changeState: function(e){ console.log("changeState"); }, 
          tooltipShow: function(e){ console.log("tooltipShow"); }, 
          tooltipHide: function(e){ console.log("tooltipHide"); } 
         }, 
         xAxis: { 
          // axisLabel: 'Week', 
          ticks: 4, // make x-axis show all 4 weeks, 

          // tickFormat: function(d){ 
          // return "week " + d; 
          // } 
         }, 
         showYAxis: true, 
         yAxis: { 
          // axisLabel: 'Score', 
          // tickFormat: function(d){ 
          //  return d3.format('.02f')(d); 
          // }, 
          ticks: 6, 
          axisLabelDistance: -10 
         }, 
         callback: function(chart){ 
          //console.log("!!! lineChart callback !!!"); 
         } 
        }, 
        // title: { 
        //  enable: true, 
        //  text: 'Title for Line Chart' 
        // }, 
        // subtitle: { 
        //  enable: true, 
        //  text: 'Subtitle for simple line chart... ', 
        //  css: { 
        //   'text-align': 'center', 
        //   'margin': '10px 13px 0px 7px' 
        //  } 
        // }, 
        // caption: { 
        //  enable: true, 
        //  html: '<b>AND</b> we can put any sort of html here too...', 
        //  css: { 
        //   'text-align': 'justify', 
        //   'margin': '10px 13px 0px 7px' 
        //  } 
        // } 
       }; 

Aber kann für das Leben nicht herausfinden, von ich wie man eine Farbe für die Achsen vorgibt oder wie man eine CSS-Klasse für die Ticktexte spezifiziert ...

Jede Hilfe sehr ...

Antwort

1

Für die y geschätzt würde Achse Sie es von CSS tun können, wie folgt:

.nvd3 .nv-Achsen-Pfad {fill: # E5E5E5; Schlaganfall: }

Verwandte Themen