AmChartsの精度

Question

他の値より上に表示されるため、精度を "stockLegend"プロパティの値に変更する必要があります。あなたはそれがすべてのパネルに設定したい場合は

"stockLegend": { 
    "periodValueTextRegular": "[[value.average]]", 
    "spacing": 10 
} 

Answer 1

値の精度は、個々のpanelレベルでprecisionを設定することによって、またはpanelsSettingsで制御することができます。トップパネルのセット以下

AmCharts.makeChart("chartdiv", { 
    // ... 
    panelsSettings: { 
    precision: 2, //global setting 
    // ... 
    }, 
    // ... 
    panels: [{ 
    // ... 
    precision: 1, //individual setting 
    // ... 
    }, 
    // ... 
    ], 
    // ... 
}); 

デモ：グローバル設定を使用して

var chartData1 = []; 
 
var chartData2 = []; 
 

 
generateChartData(); 
 

 
var chart = AmCharts.makeChart("chartdiv", { 
 
    "type": "stock", 
 
    "theme": "light", 
 

 
    "dataSets": [ { 
 
     "title": "first data set", 
 
     "fieldMappings": [ { 
 
     "fromField": "value", 
 
     "toField": "value" 
 
     }, { 
 
     "fromField": "volume", 
 
     "toField": "volume" 
 
     } ], 
 
     "dataProvider": chartData1, 
 
     "categoryField": "date" 
 
    }, 
 

 
    { 
 
     "title": "second data set", 
 
     "fieldMappings": [ { 
 
     "fromField": "value", 
 
     "toField": "value" 
 
     }, { 
 
     "fromField": "volume", 
 
     "toField": "volume" 
 
     } ], 
 
     "dataProvider": chartData2, 
 
     "compared": true, 
 
     "categoryField": "date" 
 
    } 
 
    
 
    ], 
 

 
    "panels": [ { 
 
    "precision": 2, 
 
    "recalculateToPercents": false, 
 
     "showCategoryAxis": false, 
 
     "title": "Value", 
 
     "percentHeight": 70, 
 

 
     "stockGraphs": [ { 
 
     "id": "g1", 
 
     "valueField": "value", 
 
     "comparable": true, 
 
     "compareField": "value", 
 
     "balloonText": "[[title]]:<b>[[value]]</b>", 
 
     "compareGraphBalloonText": "[[title]]:<b>[[value]]</b>" 
 
     } ], 
 

 
     "stockLegend": { 
 
     "periodValueTextComparing": "[[percents.value.close]]%", 
 
     "periodValueTextRegular": "[[value.close]]" 
 
     } 
 
    }, 
 

 
    { 
 
     "title": "Volume", 
 
     "percentHeight": 30, 
 
     "stockGraphs": [ { 
 
     "valueField": "volume", 
 
     "type": "column", 
 
     "showBalloon": false, 
 
     "fillAlphas": 1 
 
     } ], 
 

 

 
     "stockLegend": { 
 
     "periodValueTextRegular": "[[value.close]]" 
 
     } 
 
    } 
 
    ], 
 

 
    "chartScrollbarSettings": { 
 
    "graph": "g1" 
 
    }, 
 

 
    "chartCursorSettings": { 
 
    "valueBalloonsEnabled": true, 
 
    "fullWidth": true, 
 
    "cursorAlpha": 0.1, 
 
    "valueLineBalloonEnabled": true, 
 
    "valueLineEnabled": true, 
 
    "valueLineAlpha": 0.5 
 
    } 
 
    
 
}); 
 

 
function generateChartData() { 
 
    var firstDate = new Date(); 
 
    firstDate.setDate(firstDate.getDate() - 500); 
 
    firstDate.setHours(0, 0, 0, 0); 
 

 
    for (var i = 0; i < 500; i++) { 
 
    var newDate = new Date(firstDate); 
 
    newDate.setDate(newDate.getDate() + i); 
 

 
    var a1 = Math.random() * 2; 
 
    var b1 = Math.round(Math.random() * (1000 + i)) + 500 + i * 2; 
 

 
    var a2 = Math.random() * 10; 
 
    var b2 = Math.round(Math.random() * (1000 + i)) + 600 + i * 2; 
 

 
    chartData1.push({ 
 
     "date": newDate, 
 
     "value": a1, 
 
     "volume": b1 
 
    }); 
 
    chartData2.push({ 
 
     "date": newDate, 
 
     "value": a2, 
 
     "volume": b2 
 
    }); 
 
    } 
 
}

html, body { 
 
    width: 100%; 
 
    height: 100%; 
 
    margin: 0px; 
 
} 
 

 
#chartdiv { 
 
    width: 100%; 
 
    height: 100%; 
 
}

<script src="//www.amcharts.com/lib/3/amcharts.js"></script> 
 
<script src="//www.amcharts.com/lib/3/serial.js"></script> 
 
<script src="//www.amcharts.com/lib/3/themes/light.js"></script> 
 
<script src="//www.amcharts.com/lib/3/amstock.js"></script> 
 
<div id="chartdiv"></div> \t \t \t \t \t \t \t \t \t \t \t