0
Good afternoon, I am trying several times and I cannot put in y.Omain the highest automatic value, which in the example, should return to currentHegith(5) in c.y.Omain([0, D3.max(date... and not 2 which is the last argument in the list.
in console.log can be seen this value.
I would very much like to receive some help in this matter, I am not an expert.
thank you very much.
<!DOCTYPE html>
<meta charset="utf-8">
<style>
body{
margin: 0px;
font: 10px sans-serif;
}
.line {
fill: gray;
stroke: #000;
stroke-width: 2px;
}
.area {
fill: steelblue;
stroke: #000;
}
.axis path {
fill: none;
stroke: #000;
shape-rendering: crispEdges;
}
</style>
<body></body>
<script src="https://d3js.org/d3.v4.min.js"></script>
<script src="d3.min.js"></script>
<script src='d3-jetpack.js'></script>
<script src='d3-starterkit.js'></script>
<script src="lodash.js"></script>
<script>
var data = [
{name: 'a', start: 1, stop: 10},
{name: 'b', start: 2, stop: 4},
{name: 'c', start: 3, stop: 11},
{name: 'd', start: 5, stop: 15},
{name: 'e', start: 2, stop: 8},
{name: 'f', start: 5, stop: 15}
]
data = _.sortBy(data, 'start')
data.forEach(function(d){ d.points = [] })
d3.range(d3.min(data, function(d) { return d.start; }),
d3.max(data, function(d) { return d.stop; })).forEach(function(point){
var currentHeight = 0
data.forEach(function(d){
console.log(d3.max(data, function(d) { return d.total; }))
if (d.start <= point && point <= d.stop){
d.points.push({point: point, height: ++currentHeight})
if (d.stop == point) d.stopHeight = currentHeight
if (d.start == point ) d.startHeight = currentHeight
var maior = currentHeight
d.total = maior
}
})
})
var c = d3.conventions({height: 260})
console.log(d3.max(data, function(d) { return d.total; }));
c.x.domain([d3.min(data, function(d) { return d.start; }),
d3.max(data, function(d) { return d.stop; }) ])
c.y.domain([0, d3.max(data, function(d) { return d.total ; })]);
var height = 0
c.yAxis.ticks(5)
c.drawAxis()
var area = d3.svg.area()
.x(ƒ('point', c.x))
.y(ƒ('height', c.y))
c.svg.dataAppend(data, 'path.data')
.attr('d', ƒ('points', area))
.attr("class", "area")
.attr("path", area);
d3.select(self.frameElement).style("height", d3.select('svg').attr('height') + "px");
</script>