我正在制作下面的图表。
https://jsfiddle.net/2nn9q1oo/6/(请参阅问题底部的代码)
为legend
设置了保证金,但在浏览器上点击Restore down
时,保证金无效。
问题是legend
与图表重叠。
$('#container').highcharts({
"chart": {
"zoomType": "x",
"spacingRight": "5",
"spacingBottom": 0,
"marginBottom": "50",
"backgroundColor": "#FFFFFF",
"renderTo": "container_0-0_CA3B1DE2-93BC-E451-B40E-EA0594CF6192"
},
"defs": {
"patterns": [{
"id": "0099CCpattern",
"path": {
"d": "M 0 0",
"stroke": "#0099CC",
"strokeWidth": 1
}
}]
},
"title": {
"text": null
},
"subtitle": {
"text": null
},
"credits": {
"enabled": false
},
"xAxis": {
"title": {
"text": "",
"style": {
"color": "#333",
"fontWeight": "normal",
"fontSize": "12px",
"fontFamily": "Trebuchet MS, Verdana, sans-serif"
}
},
"lineColor": "#909090",
"categories": ["J", "F", "M", "A", "M", "J", "J", "A", "S", "O", "N", "D", "Y"],
"lineWidth": 1.3,
"labels": {
"staggerLines": 1,
"enabled": true,
"align": "center",
"rotation": 0
}
},
"yAxis": [{
"className": "highcharts-axisv1",
"plotLines": [{
"value": 0,
"color": "#909090",
"width": 1
}],
"gridLineWidth": 0,
"minorGridLineWidth": 0,
"gridLineColor": "#EEEEEE",
"lineColor": "#909090",
"lineWidth": "0",
"reversedStacks": false,
"max": null,
"title": {
"text": "ACT (Mio. EUR)Mio. EUR",
"style": {
"color": "#333",
"fontWeight": "normal",
"fontSize": "12px",
"fontFamily": "Trebuchet MS, Verdana, sans-serif"
}
},
"labels": {
"enabled": false
}
}, {
"className": "highcharts-axisv2",
"plotLines": [{
"value": 0,
"color": "#909090",
"width": 1
}],
"gridLineWidth": 0,
"minorGridLineWidth": 0,
"gridLineColor": "#EEEEEE",
"lineColor": "#909090",
"lineWidth": "0",
"reversedStacks": false,
"title": {
"text": "",
"style": {
"color": "#333",
"fontWeight": "normal",
"fontSize": "12px",
"fontFamily": "Trebuchet MS, Verdana, sans-serif"
}
},
"opposite": true,
"labels": {
"enabled": false
}
}],
"legend": {
"highlightSeries": {
"enabled": true
},
"enabled": true,
"layout": "horizontal",
"align": "center",
"verticalAlign": "bottom",
"floating": false,
"padding": 0,
"margin": 120,
"itemStyle": {
"fontWeight": "normal"
}
},
"plotOptions": {
"column": {
"stacking": null,
"grouping": true
},
"series": {
"events": {},
"point": {
"events": {}
},
"dataLabels": {
"style": {
"fontSize": "9px"
}
}
}
},
"tooltip": {},
"series": [{
"type": "column",
"name": "PYssss",
"data": [598139000, 539771000, 625096000, 663746000, 591762000, 703818000, 781812000, 605727000, 617162000, 713368000, 669983000, 640068000],
"stack": "0",
"yAxis": 0,
"color": "#66CCFF",
"borderWidth": 0,
"visible": true,
"pointPadding": -0.3,
"groupPadding": 0.25,
"appendix": "Mio. EUR",
"decimal": "1",
"displayOrder": "0",
"index": "0",
"legendIndex": "0",
"zIndex": "10"
}, {
"type": "column",
"name": "CYwwwww vwwwww ww",
"data": [596511000, 655649000, 786752000, 609689000, 853660000, 794944000, 749294000, 673385000, 793836000, 0, null, null],
"stack": "0",
"yAxis": 0,
"color": "#0099CC",
"borderWidth": 0,
"visible": true,
"pointPadding": -0.3,
"groupPadding": 0.25,
"dataLabels": {
"enabled": true,
"color": "black",
"inside": false,
"crop": false,
"overflow": "none",
"style": {
"fontWeight": "normal"
}
},
"appendix": "Mio. EUR",
"decimal": "1",
"displayOrder": "1",
"index": "1",
"legendIndex": "1",
"zIndex": "10"
}, {
"type": "column",
"name": "BUDwwwwwwww",
"data": [589905625.92, 578155929.93, 665928500.46, 640189735.54, 637354917.64, 672093454.04, 672548027.03, 627794143.76, 693162911.45, 688321249.35, 672359718.53, 692690283.6],
"stack": "0",
"yAxis": 0,
"color": "white",
"borderWidth": 1,
"visible": true,
"form": "budgetCols",
"borderColor": "#0099CC",
"pointPadding": -0.3,
"groupPadding": 0.25,
"appendix": "Mio. EUR",
"decimal": "1",
"displayOrder": "2",
"index": "2",
"legendIndex": "2",
"zIndex": "10"
}]
});
我该如何避免这种情况?