2

我正在构建一个结合区域和列的图表。

添加列系列时,xaxis 范围缩小,在图表的两侧留下大的空白区域。我找不到问题所在以及为什么我不能使用图表的整个宽度。

见那些例子:

没有柱状图:

结果:http: //jsfiddle.net/PL79W/12/

与列系列:

$(document).ready(function() { 
        char_option={

    chart:{
        type:null,
        renderTo:"RapportMainContener",
        zoomType:"xy",
        margin:{
            marginLeft:0
        },
        backgroundColor:"transparent"
    },
    tooltip:{
        xDateFormat:"%Y-%m-%d %H:%M",
        shared:true,
        crosshairs:{
            color:"orange",
            width:1
        },
        snap:50,
        formatter:null,
        useHTML:true,
        backgroundColor:"rgba(241, 243, 248, 0.85)"
    },
    title:null,
    xAxis:[
        {
            gridLineWidth:null,
            gridLineDashStyle:"Dash",
            type:"datetime",
            endOnTick:true,
            startOnTick:true,
            plotBands:[],
            plotLines:[],
            title:[],
            minRange:600000,
            opposite:false,
            lineColor:"#C0D0E0",
            lineWidth:0,
            tickColor:"#C0D0E0",
            tickInterval:null,
            tickPosition:"outside",
            pointPadding:null,
            groupPadding:null,
            borderWidth:null,
            formatter:null,
            min:1364346000000,
            max:1364432400000
        }
    ],
    yAxis:[
        {
            gridLineWidth:1,
            gridLineDashStyle:"Solid",
            type:"linear", 
            labels:{
                        formatter:function() {return this.value;}
            },
            title:{
                text:"Temps (ms)"
            },
            min:null,
            max:null,
            plotBands:[],
            plotLines:[],
            minRange:null,
            opposite:false,
            lineColor:"#C0D0E0",
            lineWidth:0,
            tickColor:"#C0D0E0",
            tickInterval:null,
            tickPosition:"outside",
            pointPadding:null,
            groupPadding:null,
            borderWidth:null,
            formatter:null
        },
        {
            gridLineWidth:1,
            gridLineDashStyle:"Solid",
            type:"linear",
            labels:{
                enabled:true
            },
            title:{
                text:"nbr Anomalies"
            },
            min:null,
            max:null,
            plotBands:[],
            plotLines:[],
            minRange:null,
            opposite:true,
            lineColor:"#FF0000",
            lineWidth:0,
            tickColor:"#C0D0E0",
            tickInterval:1,
            tickPosition:"outside",
            pointPadding:0,
            groupPadding:0,
            borderWidth:0,
            formatter:null
        }
    ],
    plotOptions:{
        area:{
            marker:{
                enabled:true,
                radius:1
            },
            lineWidth:1,
            connectNulls:false,
            shadow:false,
            fillOpacity:0.3,
            zIndex:1
        },
        areaspline:{
            marker:{
                enabled:false
            },
            lineWidth:1,
            connectNulls:false,
            shadow:false,
            fillOpacity:0.3,
            zIndex:1
        },
        series:{
            marker:{
                lineColor:"orange",
                states:{
                    hover:{
                        fillColor:"orange",
                        radius:1
                    }
                }
            }
        },
        column:{
            marker:{
                enabled:false
            },
            borderWidth:1,
            shadow:false,
            fillOpacity:0.3,
            zIndex:0
        }
    },
    series:[
        {
            data:[[1364346000000,828],[1364346600000,992.5],[1364347200000,1156.5],[1364347800000,1109.5],[1364348400000,1304.5],[1364349000000,1078],[1364349600000,977],[1364350200000,977],[1364350800000,961],[1364351400000,1672],[1364352000000,984.5],[1364352600000,797],[1364353200000,1125],[1364353800000,1008],[1364354400000,1055],[1364355000000,914],[1364355600000,1039],[1364356200000,851.5],[1364356800000,961],[1364357400000,945.5],[1364358000000,945.5],[1364358600000,1133],[1364359200000,945],[1364359800000,828.5],[1364360400000,1359.5],[1364361000000,1281],[1364361600000,1133],[1364362200000,945.5],[1364362800000,984.5],[1364363400000,835.5],[1364364000000,914],[1364364600000,1109.5],[1364365200000,1078],[1364365800000,1820.5],[1364366400000,922],[1364367000000,922],[1364367600000,1055],[1364368200000,960.5],[1364368800000,938],[1364369400000,976.5],[1364370000000,781],[1364370600000,953.5],[1364371200000,1718.5],[1364371800000,992],[1364372400000,1055],[1364373000000,867.5],[1364373600000,1047],[1364374200000,2375],[1364374800000,1234.5],[1364375400000,1148.5],[1364376000000,1031],[1364376600000,1234.5],[1364377200000,1023.5],[1364377800000,1015.5],[1364378400000,1078],[1364379000000,969],[1364379600000,984.5],[1364380200000,1164],[1364380800000,1210.5],[1364381400000,1367],[1364382000000,1523.5],[1364382600000,835.5],[1364383200000,1007.5],[1364383800000,1375],[1364384400000,929.5],[1364385000000,945.5],[1364385600000,969],[1364386200000,19601.5],[1364386800000,1273],[1364387400000,1210.5],[1364388000000,961],[1364388600000,890.5],[1364389200000,1039],[1364389800000,906],[1364390400000,2875],[1364391000000,1125],[1364391600000,1125.5],[1364392200000,945],[1364392800000,1266],[1364393400000,914],[1364394000000,960.5],[1364394600000,1047.5],[1364395200000,820],[1364395800000,1023],[1364396400000,906],[1364397000000,1047],[1364397600000,1078],[1364398200000,914.5],[1364398800000,1172],[1364399400000,1516],[1364400000000,1062],[1364400600000,882.5],[1364401200000,953],[1364401800000,1320.5],[1364402400000,828],[1364403000000,1008],[1364403600000,937.5],[1364404200000,1538.5],[1364404800000,914],[1364405400000,1812.5],[1364406000000,1164],[1364406600000,1062.5],[1364407200000,1038.5],[1364407800000,867],[1364408400000,812.5],[1364409000000,1524],[1364409600000,860],[1364410200000,929.5],[1364410800000,1024],[1364411400000,992.5],[1364412000000,882.5],[1364412600000,1047],[1364413200000,883.5],[1364413800000,960.5],[1364414400000,930],[1364415000000,906.5],[1364415600000,828],[1364416200000,1507.5],[1364416800000,922],[1364417400000,883],[1364418000000,1344],[1364418600000,820],[1364419200000,874.5],[1364419800000,945.5],[1364420400000,953],[1364421000000,929.5],[1364421600000,899],[1364422200000,938],[1364422800000,1187.5],[1364423400000,1007.5],[1364424000000,961],[1364424600000,961],[1364425200000,977],[1364425800000,984.5],[1364426400000,992],[1364427000000,992.5],[1364427600000,860],[1364428200000,1156.5],[1364428800000,1148.5],[1364429400000,1039],[1364430000000,1031],[1364430600000,1804.5],[1364431200000,1249.5],[1364431800000,969]],
            xAxis:0,
            yAxis:0,
            index:0,
            name:"Temps de chargement de la page et des objets",
            type:"area",
            color:null,
            zIndex:1,
            stacking:"normal",
            legend:null,
            borderWidth:null,
            fillOpacity:0.3,
            borderColor:null,
            pointPadding:null,
            groupPadding:null,
            dataLabels:{
            },
            tooltip:{
                useHTML:true,
                valueSuffix:" ms",
                pointFormat:"<div class=\\\"cartouche\\\"><div  style=\\\"background-color:{series.color};height:10px;width:10px;float:left;\\\"><\/div><span>{series.name}: <b>{point.stackY} ms<\/b><\/span><\/div>"
            }
        },
        {
            data:[[1364346000000,16],[1364346600000,7.5],[1364347200000,8],[1364347800000,31],[1364348400000,0],[1364349000000,7.5],[1364349600000,0],[1364350200000,0],[1364350800000,8],[1364351400000,0],[1364352000000,8],[1364352600000,0],[1364353200000,0],[1364353800000,0],[1364354400000,0],[1364355000000,7.5],[1364355600000,0],[1364356200000,0],[1364356800000,8],[1364357400000,0],[1364358000000,0],[1364358600000,47],[1364359200000,8],[1364359800000,15.5],[1364360400000,8],[1364361000000,55],[1364361600000,0],[1364362200000,8],[1364362800000,8],[1364363400000,8],[1364364000000,31],[1364364600000,8],[1364365200000,8],[1364365800000,39],[1364366400000,31.5],[1364367000000,7.5],[1364367600000,23],[1364368200000,16],[1364368800000,7.5],[1364369400000,0],[1364370000000,0],[1364370600000,7.5],[1364371200000,8],[1364371800000,0],[1364372400000,15.5],[1364373000000,0],[1364373600000,16],[1364374200000,180],[1364374800000,15.5],[1364375400000,15],[1364376000000,16],[1364376600000,7.5],[1364377200000,0],[1364377800000,39.5],[1364378400000,8],[1364379000000,7.5],[1364379600000,8],[1364380200000,8],[1364380800000,24],[1364381400000,8],[1364382000000,47],[1364382600000,8],[1364383200000,16],[1364383800000,15.5],[1364384400000,0],[1364385000000,23],[1364385600000,46.5],[1364386200000,16],[1364386800000,0],[1364387400000,8],[1364388000000,8],[1364388600000,16],[1364389200000,0],[1364389800000,8],[1364390400000,0],[1364391000000,23.5],[1364391600000,23],[1364392200000,16],[1364392800000,0],[1364393400000,141],[1364394000000,31.5],[1364394600000,7.5],[1364395200000,0],[1364395800000,8],[1364396400000,8],[1364397000000,8],[1364397600000,8],[1364398200000,7.5],[1364398800000,31.5],[1364399400000,0],[1364400000000,0],[1364400600000,0],[1364401200000,39],[1364401800000,31.5],[1364402400000,15.5],[1364403000000,0],[1364403600000,8],[1364404200000,8],[1364404800000,7.5],[1364405400000,0],[1364406000000,15.5],[1364406600000,8],[1364407200000,8],[1364407800000,15.5],[1364408400000,62],[1364409000000,62.5],[1364409600000,0],[1364410200000,0],[1364410800000,0],[1364411400000,8],[1364412000000,23.5],[1364412600000,47],[1364413200000,15.5],[1364413800000,8],[1364414400000,8],[1364415000000,8],[1364415600000,0],[1364416200000,23.5],[1364416800000,0],[1364417400000,7.5],[1364418000000,15],[1364418600000,8],[1364419200000,94],[1364419800000,0],[1364420400000,23.5],[1364421000000,8],[1364421600000,7.5],[1364422200000,23],[1364422800000,8],[1364423400000,24],[1364424000000,7.5],[1364424600000,15],[1364425200000,7.5],[1364425800000,0],[1364426400000,8],[1364427000000,7.5],[1364427600000,7.5],[1364428200000,7.5],[1364428800000,15.5],[1364429400000,16],[1364430000000,7.5],[1364430600000,0],[1364431200000,15.5],[1364431800000,15.5]],
            xAxis:0,
            yAxis:0,
            index:0,
            name:"Temps de chargement de la page",
            type:"area",
            color:null,
            zIndex:1,
            stacking:"normal",
            legend:null,
            borderWidth:null,
            fillOpacity:0.3,
            borderColor:null,
            pointPadding:null,
            groupPadding:null,
            dataLabels:{
            },
            tooltip:{
                useHTML:true,
                valueSuffix:" ms",
                pointFormat:"<div class=\\\"cartouche\\\"><div  style=\\\"background-color:{series.color};height:10px;width:10px;float:left;\\\"><\/div><span>{series.name}: <b>{point.stackY} ms<\/b><\/span><\/div>"
            }
        },
        {
            data:[[1364346000000,343.5],[1364346600000,328.5],[1364347200000,202.5],[1364347800000,304.5],[1364348400000,297.5],[1364349000000,250],[1364349600000,257.5],[1364350200000,312],[1364350800000,172],[1364351400000,219],[1364352000000,218.5],[1364352600000,234.5],[1364353200000,500],[1364353800000,359],[1364354400000,492],[1364355000000,320.5],[1364355600000,266],[1364356200000,351.5],[1364356800000,328],[1364357400000,265.5],[1364358000000,296.5],[1364358600000,273],[1364359200000,250],[1364359800000,430],[1364360400000,374.5],[1364361000000,516],[1364361600000,336],[1364362200000,351.5],[1364362800000,265.5],[1364363400000,187.5],[1364364000000,406],[1364364600000,265],[1364365200000,227],[1364365800000,421.5],[1364366400000,320],[1364367000000,211],[1364367600000,320.5],[1364368200000,336],[1364368800000,281],[1364369400000,242],[1364370000000,289.5],[1364370600000,273.5],[1364371200000,289],[1364371800000,304.5],[1364372400000,320],[1364373000000,414],[1364373600000,476],[1364374200000,383],[1364374800000,430],[1364375400000,562.5],[1364376000000,445.5],[1364376600000,461],[1364377200000,281.5],[1364377800000,320],[1364378400000,804],[1364379000000,328.5],[1364379600000,297],[1364380200000,562],[1364380800000,601.5],[1364381400000,328],[1364382000000,469],[1364382600000,258],[1364383200000,492],[1364383800000,687.5],[1364384400000,211],[1364385000000,461.5],[1364385600000,305],[1364386200000,398.5],[1364386800000,586.5],[1364387400000,320.5],[1364388000000,390.5],[1364388600000,414],[1364389200000,273.5],[1364389800000,422],[1364390400000,312.5],[1364391000000,328],[1364391600000,500],[1364392200000,296.5],[1364392800000,359],[1364393400000,1851.5],[1364394000000,367],[1364394600000,476.5],[1364395200000,297],[1364395800000,703.5],[1364396400000,359.5],[1364397000000,429.5],[1364397600000,554.5],[1364398200000,336],[1364398800000,648],[1364399400000,367],[1364400000000,305],[1364400600000,625.5],[1364401200000,539],[1364401800000,445],[1364402400000,328.5],[1364403000000,343.5],[1364403600000,968.5],[1364404200000,305],[1364404800000,414],[1364405400000,453],[1364406000000,547],[1364406600000,304.5],[1364407200000,382.5],[1364407800000,484.5],[1364408400000,391],[1364409000000,281],[1364409600000,171.5],[1364410200000,453],[1364410800000,359.5],[1364411400000,367],[1364412000000,328],[1364412600000,234],[1364413200000,351.5],[1364413800000,289],[1364414400000,351.5],[1364415000000,288.5],[1364415600000,289.5],[1364416200000,430],[1364416800000,312.5],[1364417400000,305],[1364418000000,344],[1364418600000,234.5],[1364419200000,203],[1364419800000,304.5],[1364420400000,500],[1364421000000,343.5],[1364421600000,265.5],[1364422200000,516],[1364422800000,546.5],[1364423400000,453],[1364424000000,445.5],[1364424600000,321],[1364425200000,422],[1364425800000,203],[1364426400000,242.5],[1364427000000,351.5],[1364427600000,523],[1364428200000,375],[1364428800000,422],[1364429400000,398],[1364430000000,203.5],[1364430600000,437.5],[1364431200000,344],[1364431800000,500]],
            xAxis:0,
            yAxis:0,
            index:0,
            name:"Réception premier octet",
            type:"area",
            color:null,
            zIndex:1,
            stacking:"normal",
            legend:null,
            borderWidth:null,
            fillOpacity:0.3,
            borderColor:null,
            pointPadding:null,
            groupPadding:null,
            dataLabels:{
            },
            tooltip:{
                useHTML:true,
                valueSuffix:" ms",
                pointFormat:"<div class=\\\"cartouche\\\"><div  style=\\\"background-color:{series.color};height:10px;width:10px;float:left;\\\"><\/div><span>{series.name}: <b>{point.stackY} ms<\/b><\/span><\/div>"
            }
        },
        {
            data:[[1364346000000,24],[1364346600000,31],[1364347200000,31.5],[1364347800000,23.5],[1364348400000,30.5],[1364349000000,16],[1364349600000,31.5],[1364350200000,16],[1364350800000,23],[1364351400000,38.5],[1364352000000,23.5],[1364352600000,23],[1364353200000,24],[1364353800000,16],[1364354400000,31],[1364355000000,15.5],[1364355600000,31],[1364356200000,23.5],[1364356800000,23],[1364357400000,23.5],[1364358000000,31.5],[1364358600000,39.5],[1364359200000,16],[1364359800000,15],[1364360400000,32],[1364361000000,31],[1364361600000,23],[1364362200000,15.5],[1364362800000,54.5],[1364363400000,16],[1364364000000,31.5],[1364364600000,31.5],[1364365200000,31],[1364365800000,23.5],[1364366400000,47],[1364367000000,23.5],[1364367600000,39],[1364368200000,31.5],[1364368800000,31.5],[1364369400000,31],[1364370000000,23],[1364370600000,23],[1364371200000,54.5],[1364371800000,32],[1364372400000,23.5],[1364373000000,23],[1364373600000,31.5],[1364374200000,15.5],[1364374800000,31.5],[1364375400000,39],[1364376000000,31],[1364376600000,31.5],[1364377200000,23.5],[1364377800000,15.5],[1364378400000,24],[1364379000000,31],[1364379600000,23.5],[1364380200000,16],[1364380800000,23.5],[1364381400000,23.5],[1364382000000,31],[1364382600000,31],[1364383200000,23.5],[1364383800000,39.5],[1364384400000,39],[1364385000000,23],[1364385600000,47],[1364386200000,23],[1364386800000,23],[1364387400000,31.5],[1364388000000,16],[1364388600000,23.5],[1364389200000,15.5],[1364389800000,23],[1364390400000,15.5],[1364391000000,31.5],[1364391600000,23],[1364392200000,24],[1364392800000,55],[1364393400000,31],[1364394000000,31],[1364394600000,15.5],[1364395200000,23.5],[1364395800000,23],[1364396400000,31.5],[1364397000000,31],[1364397600000,31],[1364398200000,15.5],[1364398800000,24],[1364399400000,23.5],[1364400000000,47],[1364400600000,23],[1364401200000,24],[1364401800000,15.5],[1364402400000,15.5],[1364403000000,23.5],[1364403600000,31.5],[1364404200000,31],[1364404800000,23.5],[1364405400000,23.5],[1364406000000,15.5],[1364406600000,23.5],[1364407200000,24],[1364407800000,23.5],[1364408400000,15.5],[1364409000000,46.5],[1364409600000,31.5],[1364410200000,24],[1364410800000,15.5],[1364411400000,23.5],[1364412000000,15.5],[1364412600000,24],[1364413200000,31],[1364413800000,15.5],[1364414400000,15.5],[1364415000000,16],[1364415600000,23],[1364416200000,23],[1364416800000,31],[1364417400000,15],[1364418000000,39],[1364418600000,23.5],[1364419200000,23.5],[1364419800000,31],[1364420400000,23],[1364421000000,31.5],[1364421600000,16],[1364422200000,23.5],[1364422800000,15.5],[1364423400000,23.5],[1364424000000,31.5],[1364424600000,31],[1364425200000,15.5],[1364425800000,39],[1364426400000,23],[1364427000000,23],[1364427600000,24],[1364428200000,16],[1364428800000,70],[1364429400000,31.5],[1364430000000,16],[1364430600000,31],[1364431200000,23.5],[1364431800000,16]],
            xAxis:0,
            yAxis:0,
            index:0,
            name:"Temps de connexion",
            type:"area",
            color:null,
            zIndex:1,
            stacking:"normal",
            legend:null,
            borderWidth:null,
            fillOpacity:0.3,
            borderColor:null,
            pointPadding:null,
            groupPadding:null,
            dataLabels:{
            },
            tooltip:{
                useHTML:true,
                valueSuffix:" ms",
                pointFormat:"<div class=\\\"cartouche\\\"><div  style=\\\"background-color:{series.color};height:10px;width:10px;float:left;\\\"><\/div><span>{series.name}: <b>{point.stackY} ms<\/b><\/span><\/div>"
            }
        },
        {
            data:[[1364346000000,38.5],[1364346600000,46.5],[1364347200000,39],[1364347800000,23.5],[1364348400000,55],[1364349000000,54.5],[1364349600000,70],[1364350200000,39],[1364350800000,47],[1364351400000,86],[1364352000000,62.5],[1364352600000,32],[1364353200000,39],[1364353800000,54],[1364354400000,39],[1364355000000,39.5],[1364355600000,15.5],[1364356200000,47],[1364356800000,32],[1364357400000,39],[1364358000000,23.5],[1364358600000,39],[1364359200000,47],[1364359800000,39.5],[1364360400000,47],[1364361000000,31],[1364361600000,47],[1364362200000,47],[1364362800000,125],[1364363400000,54],[1364364000000,31],[1364364600000,47],[1364365200000,23.5],[1364365800000,39],[1364366400000,47],[1364367000000,54.5],[1364367600000,62.5],[1364368200000,31],[1364368800000,39.5],[1364369400000,63],[1364370000000,47],[1364370600000,31.5],[1364371200000,94],[1364371800000,23],[1364372400000,55],[1364373000000,31],[1364373600000,54.5],[1364374200000,46.5],[1364374800000,31],[1364375400000,24],[1364376000000,39.5],[1364376600000,39],[1364377200000,62.5],[1364377800000,39.5],[1364378400000,46.5],[1364379000000,31],[1364379600000,38.5],[1364380200000,46.5],[1364380800000,31],[1364381400000,55],[1364382000000,70],[1364382600000,24],[1364383200000,31.5],[1364383800000,62],[1364384400000,31],[1364385000000,24],[1364385600000,39],[1364386200000,39.5],[1364386800000,31.5],[1364387400000,31],[1364388000000,31],[1364388600000,23],[1364389200000,31.5],[1364389800000,32],[1364390400000,31.5],[1364391000000,23.5],[1364391600000,32],[1364392200000,23],[1364392800000,46.5],[1364393400000,39],[1364394000000,31.5],[1364394600000,1031.5],[1364395200000,31],[1364395800000,31.5],[1364396400000,39],[1364397000000,39.5],[1364397600000,24],[1364398200000,31.5],[1364398800000,31],[1364399400000,31],[1364400000000,46.5],[1364400600000,31],[1364401200000,38.5],[1364401800000,93.5],[1364402400000,62.5],[1364403000000,39],[1364403600000,31],[1364404200000,1531],[1364404800000,23.5],[1364405400000,70],[1364406000000,23.5],[1364406600000,47],[1364407200000,39],[1364407800000,31],[1364408400000,31.5],[1364409000000,63],[1364409600000,31],[1364410200000,23],[1364410800000,70],[1364411400000,31],[1364412000000,31.5],[1364412600000,38.5],[1364413200000,31],[1364413800000,39],[1364414400000,39],[1364415000000,39],[1364415600000,31.5],[1364416200000,55],[1364416800000,39.5],[1364417400000,23.5],[1364418000000,31],[1364418600000,31],[1364419200000,23.5],[1364419800000,24],[1364420400000,31.5],[1364421000000,31.5],[1364421600000,46.5],[1364422200000,31],[1364422800000,39.5],[1364423400000,47],[1364424000000,31],[1364424600000,31],[1364425200000,70],[1364425800000,47],[1364426400000,54.5],[1364427000000,32],[1364427600000,47],[1364428200000,31],[1364428800000,62.5],[1364429400000,23],[1364430000000,31],[1364430600000,31],[1364431200000,31.5],[1364431800000,39]],
            xAxis:0,
            yAxis:0,
            index:0,
            name:"Temps de réponse DNS",
            type:"area",
            color:null,
            zIndex:1,
            stacking:"normal",
            legend:null,
            borderWidth:null,
            fillOpacity:0.3,
            borderColor:null,
            pointPadding:null,
            groupPadding:null,
            dataLabels:{
            },
            tooltip:{
                useHTML:true,
                valueSuffix:" ms",
                pointFormat:"<div class=\\\"cartouche\\\"><div  style=\\\"background-color:{series.color};height:10px;width:10px;float:left;\\\"><\/div><span>{series.name}: <b>{point.stackY} ms<\/b><\/span><\/div>"
            }
        },
        {
data:[[1364353200000,1],[1364409600000,1]],
            xAxis:0,
            yAxis:1,
            index:0,
            name:"Anomalies",
            type:"column",
            color:"rgba(255,0,0, 0.5)",
            zIndex:1,
            stacking:"normal",
            legend:null,
            borderWidth:1,
            fillOpacity:0.3,
            borderColor:"rgba(216,28,28, 0.5)",
            pointPadding:0,
            groupPadding:null,
            dataLabels:{
            },
            tooltip:null
        }
    ],
    colors:[
        "#FFC000",
        "#FF8300",
        "#4B41FF",
        "#8DC6FF",
        "#AB0000",
        "#615EB0",
        "#FCE151",
        "#FFBA00",
        "#FF9724",
        "#E39810",
        "#DF5300",
        "#F10000",
        "#94211A",
        "#4A411B",
        "#015F1B",
        "#298A2F",
        "#869420",
        "#83803B",
        "#806460",
        "#782FA7",
        "#7309DB",
        "#5900B0",
        "#FFC000",
        "#FF8300",
        "#4B41FF",
        "#8DC6FF",
        "#AB0000",
        "#615EB0",
        "#FCE151",
        "#FFBA00",
        "#FF9724",
        "#E39810",
        "#DF5300",
        "#F10000",
        "#94211A",
        "#4A411B",
        "#015F1B",
        "#298A2F",
        "#869420",
        "#83803B",
        "#806460",
        "#782FA7",
        "#7309DB",
        "#5900B0"
    ]

}
                                                                                            chart = new Highcharts.Chart(char_option);}) 

结果:http: //jsfiddle.net/PL79W/11/

谢谢

4

2 回答 2

0

为 xAxis删除startOnTickendOnTick,并且可以正常工作,请参阅:http: //jsfiddle.net/PL79W/13/

于 2013-03-29T11:55:26.763 回答
-1

这不是一个答案,但我也无法让它工作,并且提供的所有答案都有太多代码需要筛选以找到解决方案。因此,将其简化为两点图,我希望所有图(区域和线)扩展图表的整个宽度,左右没有间隙。

这是我的小提琴:http: //jsfiddle.net/lamarant/KTksk/

$('#container').highcharts({
    chart: {
        type: 'area',
        plotBackgroundColor: '#00B417'
    },
    xAxis: {
        categories: ['Mar', 'Apr']
    },
    yAxis: {
        plotLines: [{
            value: 0,
            width: 1,
            color: '#808080'
        }]
    },
    plotOptions: {
        area: {
            pointPlacement: 'on',
            connectNulls: true
        },
        line: {
            connectNulls: true
        }
    },
    series: [{
        showInLegend: false,
        data: [194, 205],
        marker: {
            enabled: false
        },
        fillColor: '#D9B900',
        lineColor: '#D9B900'
    }, {
        showInLegend: false,
        data: [180, 190],
        marker: {
            enabled: false
        },
        fillColor: '#B80006',
        lineColor: '#B80006'
    }, {
        type: 'line',
        name: 'Actual Values',
        lineColor: '#000000',
        color: '#000000',
        data: [225, 215]
    }, {
        type: 'line',
        name: 'Target Values',
        lineColor: '#0000ff',
        color: '#0000ff',
        data: [200, 200]
    }]
});
于 2013-06-25T16:05:36.513 回答