blob42/nvd3
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Fix issue with sparkline min and max dots incorrectly positioned

Browse Source
This commit is contained in:
Bob Monteverde 2012-10-20 01:39:49 -04:00
parent 121183f8ed
commit f8141c046e
5 changed files with 46 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
examples/sparklinePlus.html
View File

@ -25,32 +25,36 @@ text {
<script src="../src/models/sparklinePlus.js"></script>
<script>
nv.addGraph({
generate: function() {
var chart = nv.models.sparklinePlus()
//.width(400)
//.height(50)
nv.addGraph(function() {
var data = sine();
var chart = nv.models.sparklinePlus()
d3.select("#chart1")
//.datum([]) //for testing "noData"
.datum(sine())
.transition().duration(250)
.call(chart);
chart
.x(function(d,i) { return i })
.xTickFormat(function(d) {
return d3.time.format('%x')(new Date(data[d].x))
})
return chart;
},
callback: function(graph) {
//log("Sparkline rendered");
}
d3.select("#chart1")
.datum(data)
.transition().duration(250)
.call(chart);
return chart;
});
var now =+new Date();
function sine() {
var sin = [];
nv.log(now);
for (var i = 0; i < 100; i++) {
sin.push({x: i + 100, y: Math.sin(i/10)});
sin.push({x: now + i * 1000 * 60 * 60 * 24, y: Math.sin(i/10)});
}
return sin;

12
nv.d3.js
View File

@ -9460,12 +9460,18 @@ nv.models.sparkline = function() {
// TODO: Add CURRENT data point (Need Min, Mac, Current / Most recent)
var points = wrap.selectAll('circle.nv-point')
.data(function(d) { return d.filter(function(p,i) { return y.domain().indexOf(getY(p,i)) != -1 || getX(p,i) == x.domain()[1] }) });
.data(function(data) {
return data.map(function(d,i) {
if (y.domain().indexOf(getY(d,i)) != -1 || getX(d,i) == x.domain()[1]) d.pointIndex = i;
return d;
})
.filter(function(d) { return typeof d.pointIndex != 'undefined' })
});
points.enter().append('circle').attr('class', 'nv-point');
points.exit().remove();
points
.attr('cx', function(d,i) { return x(getX(d,i)) })
.attr('cy', function(d,i) { return y(getY(d,i)) })
.attr('cx', function(d,i) { return x(getX(d,d.pointIndex)) })
.attr('cy', function(d,i) { return y(getY(d,d.pointIndex)) })
.attr('r', 2)
.style('stroke', function(d,i) { return d.x == x.domain()[1] ? '#444' : d.y == y.domain()[0] ? '#d62728' : '#2ca02c' })
.style('fill', function(d,i) { return d.x == x.domain()[1] ? '#444' : d.y == y.domain()[0] ? '#d62728' : '#2ca02c' });

10
nv.d3.min.js vendored
View File

File diff suppressed because one or more lines are too long

12
src/models/sparkline.js
View File

@ -67,12 +67,18 @@ nv.models.sparkline = function() {
// TODO: Add CURRENT data point (Need Min, Mac, Current / Most recent)
var points = wrap.selectAll('circle.nv-point')
.data(function(d) { return d.filter(function(p,i) { return y.domain().indexOf(getY(p,i)) != -1 || getX(p,i) == x.domain()[1] }) });
.data(function(data) {
return data.map(function(d,i) {
if (y.domain().indexOf(getY(d,i)) != -1 || getX(d,i) == x.domain()[1]) d.pointIndex = i;
return d;
})
.filter(function(d) { return typeof d.pointIndex != 'undefined' })
});
points.enter().append('circle').attr('class', 'nv-point');
points.exit().remove();
points
.attr('cx', function(d,i) { return x(getX(d,i)) })
.attr('cy', function(d,i) { return y(getY(d,i)) })
.attr('cx', function(d,i) { return x(getX(d,d.pointIndex)) })
.attr('cy', function(d,i) { return y(getY(d,d.pointIndex)) })
.attr('r', 2)
.style('stroke', function(d,i) { return d.x == x.domain()[1] ? '#444' : d.y == y.domain()[0] ? '#d62728' : '#2ca02c' })
.style('fill', function(d,i) { return d.x == x.domain()[1] ? '#444' : d.y == y.domain()[0] ? '#d62728' : '#2ca02c' });

3
src/nv.d3.css
View File

@ -532,7 +532,10 @@ svg .title {
.nvd3.nv-sparklineplus .nv-xValue,
.nvd3.nv-sparklineplus .nv-yValue {
/*
stroke: #666;
*/
stroke-width: 0;
font-size: .8em;
font-weight: normal;
}