AmchartsにballoonTextの値が最も高く表示されていません

Question

Amchartsプラグインの3D Stacked Column Chartを使用しています。出力は正しく表示されますが、棒グラフの最高値を表示することはできません。

最大値にカーソルを置こうとすると、ラベルは表示されません。 以下はamchartsスクリプトの場合です。

var chart = AmCharts.makeChart("chartdiv", { 
      "theme": "light", 
      "labelText": "[[title]]: [[value]]", 
      "type": "serial", 
      "titles": [{ 
       "text": "Benches Classification by Borough", 
       "size": 16 
      }], 
      "valueAxes": [{ 
       "stackType": "3d", 
       "unit": "", 
       "position": "left", 
       "title": "Bench Counts:", 
      }], 
      "startDuration": 1, 
      "graphs": [ 
      { 
       "balloonText": "backless : [[value]]", 
       "fillAlphas": 0.9, 
       "lineAlpha": 0.2, 
       "title": "backless", 
       "type": "column", 
       "valueField": "backless" 
      }, 
      { 
       "balloonText": "backed:[[value]]", 
       "fillAlphas": 0.9, 
       "lineAlpha": 0.2, 
       "title": "backed", 
       "type": "column", 
       "valueField": "backed" 
      }], 

      "plotAreaFillAlphas": 0.1, 
      "depth3D": 73, 
      "angle": 60, 
      "categoryField": "Borough", 
      "categoryAxis": { 
       "gridPosition": "start" 
      }, 
      "export": { 
       "enabled": true 
      } 
     }); 

Answer 1

デフォルトの動作では、スペースがなければバルーンが表示されません（3Dチャートはもう少し手間がかかります）。値軸の最大値を大きくするには、値軸にminMaxMultiplierを小さな値に設定することで回避できます。負の軸を避けるためにデータが常に正である場合は、minimumを強制的に0にしたいと思うでしょう。

var chart = AmCharts.makeChart("chartdiv", { 
 
    "theme": "light", 
 
    "labelText": "[[title]]: [[value]]", 
 
    "type": "serial", 
 
    "dataProvider": [{ 
 
     "backed": 113, 
 
     "backless": 56, 
 
     "Borough": "Manhattan" 
 
    }, 
 
    { 
 
     "backed": 190, 
 
     "backless": 64, 
 
     "Borough": "Bronx" 
 
    }, 
 
    { 
 
     "backed": 127, 
 
     "backless": 38, 
 
     "Borough": "Brooklyn" 
 
    }, 
 
    { 
 
     "backed": 135, 
 
     "backless": 50, 
 
     "Borough": "Queens" 
 
    }, 
 
    { 
 
     "backed": 105, 
 
     "backless": 31, 
 
     "Borough": "Staten Island" 
 
    } 
 
    //Lower Manhattan is not a separate borough ;) 
 
    ], 
 
    "titles": [{ 
 
    "text": "Benches Classification by Borough", 
 
    "size": 16 
 
    }], 
 
    "valueAxes": [{ 
 
    "stackType": "3d", 
 
    "unit": "", 
 
    "position": "left", 
 
    "title": "Bench Counts:", 
 
    "minMaxMultiplier": 1.05, 
 
    "minimum": 0 
 
    }], 
 
    "startDuration": 1, 
 
    "graphs": [{ 
 
     "balloonText": "backless : [[value]]", 
 
     "fillAlphas": 0.9, 
 
     "lineAlpha": 0.2, 
 
     "title": "backless", 
 
     "type": "column", 
 
     "valueField": "backless" 
 
    }, 
 
    { 
 
     "balloonText": "backed:[[value]]", 
 
     "fillAlphas": 0.9, 
 
     "lineAlpha": 0.2, 
 
     "title": "backed", 
 
     "type": "column", 
 
     "valueField": "backed" 
 
    } 
 
    ], 
 

 
    "plotAreaFillAlphas": 0.1, 
 
    "depth3D": 73, 
 
    "angle": 60, 
 
    "categoryField": "Borough", 
 
    "categoryAxis": { 
 
    "gridPosition": "start" 
 
    }, 
 
    "export": { 
 
    "enabled": true 
 
    } 
 
});

<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> 
 
<script type="text/javascript" src="//www.amcharts.com/lib/3/themes/light.js"></script> 
 
<div id="chartdiv" style="width: 100%; height: 300px"></div>

別の方法としては、外部のdivを使用して、独自の風船を作成し、バルーンをトリガするためにrollOverGraphItemとrollOutGraphItemイベントを活用することです。 AmChartsのknowledge baseにこれの例があります。

Answer 2

ラベルがビューの外にある可能性があります。ラベルを右クリックして、ラベルがあるかどうかを調べることができます。

上部に余白を追加してみますか？