Reputation: 2300
I have a serial amChart and on the CathegoryAxis I have year-values (from 2001 to 2016) and I want to display only some of them. With forceShowField I can show them, but the default ticks are still there. Is there a way to display the forceSHowFields only or to give a list with all ticks?
var chart = AmCharts.makeChart("resultchart", {
"type": "serial",
"theme": "light",
"marginRight": 40,
"marginLeft": 40,
"autoMarginOffset": 20,
"mouseWheelZoomEnabled": false,
"period":'YYYY',
"dataDateFormat": "YYYY",
"categoryField": "date",
"categoryAxis": {
"parseDates": false,
"dashLength": 1,
"forceShowField":"forceShow",
"startOnAxis": true
},
"numberFormatter": {
"precision": 0,
"decimalSeparator": ",",
"thousandsSeparator": "."
},
"export": {
"enabled": true,
"menu":[]
}
})
<div id="resultchart"></div>
Upvotes: 0
Views: 360
Reputation: 16012
The only way to show specific ticks is to disable the axis-generated labels and ticks and create your own using guides:
"categoryAxis": {
// ...
//disable labels/ticks generated by axes
"labelsEnabled": false,
"tickLength": 0,
//use guides to create your own
"guides": [{
"category": "2004",
"label": "2004",
"tickLength": 5
}, {
"category": "2008",
"label": "2008",
"tickLength": 5
},
var chart = AmCharts.makeChart("resultchart", {
"type": "serial",
"theme": "light",
"marginRight": 40,
"marginLeft": 40,
"autoMarginOffset": 20,
"mouseWheelZoomEnabled": false,
"graphs": [{
"valueField": "value",
"type": "column",
"fillAlphas": .8
}],
"categoryField": "date",
"categoryAxis": {
"dashLength": 1,
"startOnAxis": true,
//disable labels/ticks generated by axes
"labelsEnabled": false,
"tickLength": 0,
//use guides to create your own
"guides": [{
"category": "2004",
"label": "2004",
"tickLength": 5
}, {
"category": "2008",
"label": "2008",
"tickLength": 5
}, {
"category": "2012",
"label": "2012",
"tickLength": 5
}, {
"category": "2016",
"label": "2016",
"tickLength": 5
}]
},
"numberFormatter": {
"precision": 0,
"decimalSeparator": ",",
"thousandsSeparator": "."
},
"export": {
"enabled": true,
"menu": []
},
"dataProvider": [{
"date": 2001,
"value": 16
},
{
"date": 2002,
"value": 10
},
{
"date": 2003,
"value": 12
},
{
"date": 2004,
"value": 15
},
{
"date": 2005,
"value": 18
},
{
"date": 2006,
"value": 10
},
{
"date": 2007,
"value": 17
},
{
"date": 2008,
"value": 19
},
{
"date": 2009,
"value": 18
},
{
"date": 2010,
"value": 10
},
{
"date": 2011,
"value": 13
},
{
"date": 2012,
"value": 17
}
]
})
<script type="text/javascript" src="//www.amcharts.com/lib/3/amcharts.js"></script>
<script type="text/javascript" src="//www.amcharts.com/lib/3/serial.js"></script>
<div id="resultchart" style="width: 100%; height: 300px;"></div>
Upvotes: 1