2017-11-06 3 views
1

Ich habe ein Balkendiagramm, ich möchte einen schattierten Bereich auf dem gleichen Graphen darstellen, dessen Maximal- und Minimalbereich -1000k und -1250k sind, was höchstwahrscheinlich ein Bereichsdiagramm ist . Ich kann kein Beispiel im Highchart-Dokument finden, brauche also Hilfe.Kombinationsdiagramm (Bereich und Balken) highchart

Die Grafik habe ich jetzt ->http://jsfiddle.net/hhh2zx3w/6/

var c2chart3=Highcharts.chart("container1", { 
    colors: ['rgb(90,198,140)','rgb(255,179,137)','rgb(246,151,159)','rgb(55,183,74)','rgb(169,99,169)','rgb(0,191,243)','rgb(223,200,24)','rgb(242,100,38)'], 

    chart: { 
     type: 'bar', 
     backgroundColor: 'rgba(0,0,0,0.7)', 
     style: { 
      color: '#FFF', 
      fontSize: '9px', 
      fontFamily: 'MP' 
     }, 
    }, 
    title: { 
     text: '' 
    }, 
    xAxis: { 
     title: { 
     text: null 
     }, 
     gridLineWidth:0, 
     lineWidth:0, 
     tickWidth: 0, 
     title: { 
     text: '' 
     }, 
     labels: { 
     style: { 
      color: '#FFF', 
      fontSize: '9px', 
      fontFamily: 'MP' 
     }, 
     formatter: function(){ 
      return "" 
     } 
     }, 
    }, 
    yAxis: { 
    // min: -2000000, 
    // max: 1000000, 
    gridLineColor: '#fff', 
    gridLineWidth: 0, 
    lineWidth:0, 
    plotLines: [{ 
     color: '#fff', 
     width: 1, 
     value: 0 
    }], 
    title: { 
     text: '', 
     align: 'high' 
    }, 
    title: { 
     text: '' 
    }, 
    labels: { 
     style: { 
     color: '#FFF', 
     fontSize: '9px' 
     }, 
    }, 
    }, 
    tooltip: { enabled: false }, 
    credits: { enabled: false }, 
    exporting: { enabled: false }, 
    plotOptions: { 
    bar: { 
    dataLabels: { 
    enabled: true, 
    style: { 
     textOutline: false, 
     color:'#fff', 
    } 
    } 
    }, 
    series: { 
    colorByPoint: true, 
    pointWidth: 1, 
    borderWidth:0, 
    dataLabels: { 
    enabled: true, 
    formatter: function(){ 
    } 
    } 
    } 
}, 
legend: { enabled: false }, 
credits: { enabled: false }, 
series: [{ 
    data: [-510362,-371233,-1593711,-388465,352395,179298,-1190969,-907204] 
}] 
}); 

Was ich will, ist so etwas wie enter image description here

im Bild dargestellten

Antwort

Verwandte Themen