获取先前值的实现存在问题。例如:
[ {
"date": "2009-09-1",
"test": 100,
"test2": 900
}, {
"date": "2009-09-2",
"test": 200,
"test2": 800
}, {
"date": "2009-09-3",
"test": 300,
"test2": 700
}, {
"date": "2009-09-4",
"test": 400,
"test2": 600
}, {
"date": "2009-09-5",
"test": 500,
"test2": 500
} ]
我需要一些数据来获取前一个点的每个点的值,从当前值减去或增加。例如,在'测试' 2009-09-2建议我应该显示"测试:200(+100)"和' test2' 2009-09-4" test2:600(-100)"
在网站上的示例中找不到解决方案。
http://jsfiddle.net/Ltv1yLn3/2/
var chartData = [{"date":"2009-09-1","test":100, "test2": 900}, {"date":"2009-09-2","test":200, "test2": 800}, {"date":"2009-09-3","test":300, "test2": 700}, {"date":"2009-09-4","test":400, "test2": 600}, {"date":"2009-09-5","test":500, "test2": 500}];
var chart = AmCharts.makeChart("chartdiv", {
"type": "serial",
"theme": "light",
"dataDateFormat": "YYYY-MM-DD",
"legend": {
"useGraphSettings": true,
"align": "center",
"valueAlign": "left",
"valueText": "[[value]] ([[percents]]%)"
},
"dataProvider": chartData,
"graphs": [
{
"lineColor": "#000000",
"bullet": "round",
"bulletBorderAlpha": 1,
"bulletColor": "#FFFFFF",
"bulletSize": 3,
"hideBulletsCount": 50,
"lineThickness": 2,
"useLineColorForBulletBorder": true,
"title": "Test 1",
"valueField": "test",
"balloonText": "[[title]]: [[value]] (-+100)"
},
{
"lineColor": "#111111",
"bullet": "round",
"bulletBorderAlpha": 1,
"bulletColor": "#FFFFFF",
"bulletSize": 3,
"hideBulletsCount": 50,
"lineThickness": 2,
"useLineColorForBulletBorder": true,
"title": "Test 2",
"valueField": "test2","balloonText": "[[title]]: [[value]] (-+100)"
},
],
"chartCursor": {
"valueLineEnabled": true,
"valueLineBalloonEnabled": true,
"valueLineAlpha": 0.5,
"fullWidth": true,
"cursorAlpha": 0.05
},
"categoryField": "date",
});
答案 0 :(得分:4)
您可以使用图表balloonFunction
自动计算更改。
即:
= simple_form_for @vacancy do |f|
... regular fields that are saving correctly ...
.vacancyschedules
= f.simple_fields_for :vacancyschedules do |vacancyschedule|
=render "vacancyschedule_fields", f: vacancyschedule
.links
=link_to_add_association 'add schedule', f, vacancyschedules
工作"graphs": [ {
// ...
"balloonText": "[[title]]",
"balloonFunction": balloonFunction
}, {
// ...
"balloonText": "[[title]]",
"balloonFunction": balloonFunction
} ]
就是这样:
balloonFunction
以上是您更新的小提琴:
http://jsfiddle.net/Ltv1yLn3/3/
P.S。请注意,即使我们使用function balloonFunction( item, graph ) {
// init variables
var chart = graph.chart;
var key = graph.valueField;
var data = chart.dataProvider;
var text = graph.title + ": " + data[ item.index ][ key ];
// add change if it's not the first item
if ( item.index ) {
var change = data[ item.index ][ key ] - data[ item.index - 1 ][ key ]
var sign = change > 0 ? "+" : "";
text += " (" + sign + change + ")";
}
return text;
}
格式化气球内容,仍然需要balloonFunction
,因为如果没有balloonText
则不会被调用。
答案 1 :(得分:1)
您可以使用自定义baloon功能代替baloonText
:
function adjustBalloonText(graphDataItem, graph){
var currentValue = graphDataItem.values.value;
var previousValue = // calculate it somehow (probably by searching in the original data source)
return currentValue + " (" + previousValue + ")";
}
请参阅http://www.amcharts.com/tutorials/updating-balloon-tool-tip-text-fly/