これは、アプリのチャートをどのように見せたいかの Plunkr です: http://plnkr.co/edit/19D5cnrVYdUrMlblQARy?p=preview
タイムスパン距離計はまったくありません。
ただし、私のアプリでは次のように表示されます。
私の renderChart 関数:
function renderChart(ticker, limit) {
TickerChartFactory.returnTickerChartData(ticker, limit).then(
function(res) {
console.log('res =',res);
if (res.data.status === 'Success') {
console.log('res.data.quotes =',res.data.quotes);
var data_array = [];
for (var i=0; i<res.data.quotes.length; i++) {
data_array.push([res.data.quotes[i].start_epoch, res.data.quotes[i].price]);
}
vm.tickerPrice.chartData = [
{
"area": true,
"key": "Price",
"color": '#BFBFBF',
"values": data_array
}
];
console.log('vm.tickerPrice.chartData =',vm.tickerPrice.chartData);
drawChart(vm.tickerPrice.chartData);
}
else {
console.log('There was an error in retrieving quote data');
}
});
}
次に、私の drawChart 関数:
function drawChart(res) {
console.log(' ');
console.log('drawChart res = ',res);
nv.addGraph(function() {
var chart = nv.models.linePlusBarChart()
.margin({top: 30, right: 40, bottom: 50, left: 40})
.x(function(d,i) { return i })
.y(function(d) { return d[1] })
.color(d3.scale.category10().range());
chart.xAxis.tickFormat(function(d) {
var dx = res[0].values[d] && res[0].values[d][0] || 0;
return d3.time.format('%x')(new Date(dx))
});
chart.y1Axis
.tickFormat(d3.format(',f'));
chart.y2Axis
.tickFormat(function(d) { return '$' + d3.format(',f')(d) });
chart.bars.forceY([0]);
d3.select('#chart svg')
.datum(res)
.transition().duration(500)
.call(chart);
nv.utils.windowResize(chart.update);
return chart;
});
}
コンソールに表示される応答
彼らのドキュメントには、それを削除する方法を示すものは何も見つかりませんでした。