向AmCharts圖例中的圖例添加最後的值

Question

有沒有方法可以將圖表中的最後一個值添加到圖例名稱，而不是懸停在AmCharts圖表上？

下面是帶演示圖表的代碼筆。 https://codepen.io/anon/pen/LxmLaL

這裏是js代碼

var chartData = generateChartData(); 

var chart = AmCharts.makeChart("chartdiv", { 
    "type": "serial", 
    "theme": "light", 
    "legend": { 
     "periodValueText":"last" 
    }, 
    "dataProvider": chartData, 
    "synchronizeGrid":true, 
    "valueAxes": [{ 
     "id":"v1", 
     "axisColor": "#FF6600", 
     "axisThickness": 2, 
     "axisAlpha": 1, 
     "position": "left" 
    }, { 
     "id":"v2", 
     "axisColor": "#FCD202", 
     "axisThickness": 2, 
     "axisAlpha": 1, 
     "position": "right" 
    }, { 
     "id":"v3", 
     "axisColor": "#B0DE09", 
     "axisThickness": 2, 
     "gridAlpha": 0, 
     "offset": 50, 
     "axisAlpha": 1, 
     "position": "left" 
    }], 
    "graphs": [{ 
     "valueAxis": "v1", 
     "lineColor": "#FF6600", 
     "bullet": "round", 
     "bulletBorderThickness": 1, 
     "hideBulletsCount": 30, 
     "title": "red line", 
     "valueField": "visits", 
     "fillAlphas": 0 
    }, { 
     "valueAxis": "v2", 
     "lineColor": "#FCD202", 
     "bullet": "square", 
     "bulletBorderThickness": 1, 
     "hideBulletsCount": 30, 
     "title": "yellow line", 
     "valueField": "hits", 
     "fillAlphas": 0 
    }, { 
     "valueAxis": "v3", 
     "lineColor": "#B0DE09", 
     "bullet": "triangleUp", 
     "bulletBorderThickness": 1, 
     "hideBulletsCount": 30, 
     "title": "green line", 
     "valueField": "views", 
     "fillAlphas": 0 
    }], 
    "chartScrollbar": {}, 
    "chartCursor": { 
     "cursorPosition": "mouse" 
    }, 
    "categoryField": "date", 
    "categoryAxis": { 
     "parseDates": true, 
     "axisColor": "#DADADA", 
     "minorGridEnabled": true 
    } 
}); 

chart.addListener("dataUpdated", zoomChart); 
zoomChart(); 


// generate some random data, quite different range 
function generateChartData() { 
    var chartData = []; 
    var firstDate = new Date(); 
    firstDate.setDate(firstDate.getDate() - 100); 

    for (var i = 0; i < 100; i++) { 
     // we create date objects here. In your data, you can have date strings 
     // and then set format of your dates using chart.dataDateFormat property, 
     // however when possible, use date objects, as this will speed up chart rendering. 
     var newDate = new Date(firstDate); 
     newDate.setDate(newDate.getDate() + i); 

     var visits = Math.round(Math.sin(i * 5) * i); 
     var hits = Math.round(Math.random() * 80) + 500 + i * 3; 
     var views = Math.round(Math.random() * 6000) + i * 4; 

     chartData.push({ 
      date: newDate, 
      visits: visits, 
      hits: hits, 
      views: views 
     }); 
    } 
    return chartData; 
} 

function zoomChart(){ 
    chart.zoomToIndexes(chart.dataProvider.length - 20, chart.dataProvider.length - 1); 
} 

我相信這是與periodValueText但我無法弄清楚如何實現相同的。任何幫助，將不勝感激。

Answer 1

您已經正確指出需要使用periodValueText。你只需要在其中使用雙括號元代碼。對於接近的價值它是[[value.close]]：

"legend": { 
    "periodValueText":"[[value.close]]" 
}