2016-03-23 18 views
0

Gibt es eine Möglichkeit, Hintergrundfarbe und Deckkraft in Highcharts für ein Diagramm vom Typ Bereich festzulegen?Highcharts Hintergrundfarbe und Deckkraft einstellen

Gemäß der Dokumentation müssen Sie die Deckkraft einstellen, indem Sie die Farbe als RGB-Wert angeben und dann einen Deckkraftwert hinzufügen. Wenn ich dies tue, erhalte ich jedoch die Füllfarbe des Diagramms als schwarz. Unten ist mein Code

<script type="text/javascript"> 
$(function() { 
var javascriptArray = <?php echo json_encode($array);?>; 
var newjavascriptArray = <?php echo json_encode($uniqueDates);?>; 
var valueArray = <?php echo json_encode($total); ?>; 
var js_array2 = [5, 10, 15]; 
    $('#container').highcharts({ 
    credits : { 
    enabled: false 
}, 
exporting: 
{ 
    enabled: false 
}, 
    chart: { 
     backgroundColor: '#10416A', 
     type: "area" 

    }, 
    title: { 
    style : { 
     color: "white" 
    }, 
     text: "Progress" 
    }, 
    subtitle: { 
    style : { 
     color: "white" 
    }, 
     text: 'Village Print & Media' 
    }, 
    xAxis: { 
    // gridLineWidth: 0, 
    // lineWidth: 0, 
    // minorGridLineWidth: 0, 
    title:{ 
     style: { 
     color : "white" 
     }, 
     margin: 50, 
     text: "February" 
    }, 
    labels: { 
    style : { 
     color: "white" 
    }, 
    }, 
    categories: newjavascriptArray 
    }, 
    yAxis: { 
    allowDecimals: false, 
     title: { 
     style: { 
      color : "white" 
     }, 
      text: "Points" 
     }, 
     labels : { 
     style: { 
      color: "white" 
     }, 
     }, 
    }, 

     plotOptions: { 

     series: { 
     color: "#00A6CE", 
     lineColor: "#00A6CE", 
     fillColor: 'rgb(0, 166, 206, 0.4)', 
     // fillOpacity: 0.8, 
     marker : { 
      fillColor: "#00A6CE" 
     }, 
     }, 
     line: { 
      dataLabels: { 
       enabled: false 
      }, 
      enableMouseTracking: true 
     } 


    }, 
    legend: { 
     layout: 'vertical', 
     align: 'right', 
     verticalAlign: 'middle', 
     borderWidth: 2, 
     color: "white" 
    }, 
    series: [{ 
     name: 'Points Ray', 
     color: "white", 
     dataLabels: { 
     color:"white" 
     }, 
     data: valueArray 
    }] 
}); 
}); 

Antwort

2

http://api.highcharts.com/highcharts#plotOptions.area.fillOpacity

Beachten Sie, wenn Sie eine explizite fillColor setzen, wird die fillOpacity nicht angewendet.

Sie können also die Eigenschaft fillOpacity nicht verwenden.

Ich habe Ihren Code versucht und fillColor: 'rgb(0, 166, 206, 0.4)' nicht die Opazität unterstützen, aber es funktioniert richtig mit fillColor: 'rgba(0, 166, 206, 0.4)'

Hope this Hilfe.

+1

Danke, das hat für mich funktioniert – ray

Verwandte Themen