2017-11-06 9 views
0

私はシリアルamChartを持っていますが、CathegoryAxisには年値(2001年から2016年まで)があり、そのうちのいくつかしか表示しません。 forceShowFieldを使って表示することはできますが、デフォルトの目盛りはまだ表示されています。 forceSHowFieldsのみを表示する方法や、すべてのティックを含むリストを与える方法はありますか?x軸にForceShowティックだけを表示する方法は?

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>

答えて

1

特定のダニを表示する唯一の方法は、axis-generated labelsticksを無効にし、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>

+0

ありがとう、それは私が探していたものです –

関連する問題