Bar chart output isn't what's expected - javascript

I am making a bar chart with D3. Most of the work is done, but the output is not behaving as I expect it to, and I can't figure the problem out.
The sample data is this, which is a JSON file comprising an array of figures for Gross Domestic Product in the US.
My bar chart is showing the curve I expect, although the figures start just over 2000, whereas in the data, they start at just over 200. I have attempted to change around the values but each time I tinker with the y positioning and height, I get unexpected results.
JS:
var fccDataUrl = 'https://raw.githubusercontent.com/FreeCodeCamp/ProjectReferenceData/master/GDP-data.json';
var dataset;
var fccData;
$.getJSON(fccDataUrl, (myData) => {
dataset = myData.data;
fccData = myData;
console.log('dataset', dataset)
console.log('fccData', fccData)
var w = '800'
var h = '500'
var padding = 50;
var svg = d3.select('body')
.append('svg')
.attr('width', w)
.attr('height', h)
var xScale = d3.scale.linear()
.domain([1947, 2015])
.range([padding, w - padding])
var yScale = d3.scale.linear()
.domain([0, d3.max(dataset, d => d[1])])
.range([h - padding, padding])
var xAxis = d3.svg.axis()
.scale(xScale)
.orient('bottom')
.ticks(10)
var yAxis = d3.svg.axis()
.scale(yScale)
.orient('left')
.ticks(10)
svg.selectAll('rect')
.data(dataset)
.enter()
.append('rect')
.classed('bars', true)
.attr('x', (d, i) => i * (w / dataset.length) + 50)
.attr('y', d => yScale(d[1]) - 50)
.style('width', '4px')
.style('height', d => h - yScale(d[1]))
svg.append('g')
.attr('class', 'axis')
.attr('transform', `translate(0, ${h - padding})`)
.call(xAxis)
svg.append('g')
.attr('class', 'axis')
.attr('transform', `translate(${padding}, 0)`)
.call(yAxis)
});
Here is a codepen of my work so far.


There is some mix-up between h, and the chart height. Here is an updated codepen with the padding, h, and chartHeight defined separately.
var fccDataUrl = 'https://raw.githubusercontent.com/FreeCodeCamp/ProjectReferenceData/master/GDP-data.json';
var dataset;
var fccData;
$.getJSON(fccDataUrl, (myData) => {
dataset = myData.data;
fccData = myData;
console.log('dataset', dataset)
console.log('fccData', fccData)
var w = '800'
var h = '500'
var padding = {top: 50, bottom: 50, right: 50, left: 50};
var chartWidth = w - padding.left - padding.right;
var chartHeight = h - padding.top - padding.bottom;
var svg = d3.select('body')
.append('svg')
.attr('width', w)
.attr('height', h)
.append("g") // apply the transform to the parent elem instead of individually.
.attr("transform", `translate(${padding.left}, ${padding.top})`)
var xScale = d3.scale.linear()
.domain([1947, 2015])
.range([0, chartWidth]) // no need to account for padding anymore
var yScale = d3.scale.linear()
.domain([0, d3.max(dataset, d => d[1])])
.range([chartHeight, 0]) // no need to account for padding anymore
var xAxis = d3.svg.axis()
.scale(xScale)
.orient('bottom')
.ticks(10)
var yAxis = d3.svg.axis()
.scale(yScale)
.orient('left')
.ticks(10)
svg.selectAll('rect')
.data(dataset)
.enter()
.append('rect')
.classed('bars', true)
.attr('x', (d, i) => i * (w / dataset.length)) // no need to account for padding anymore
.attr('y', d => yScale(d[1])) // no need to account for padding anymore
.style('width', '4px')
.style('height', d => chartHeight - yScale(d[1]))
svg.append('g')
.attr('class', 'axis')
.attr('transform', `translate(0, ${chartHeight})`) // no need to account for padding anymore
.call(xAxis)
svg.append('g')
.attr('class', 'axis')
//.attr('transform', `translate(${padding}, 0)`) // no need to account for padding anymore
.call(yAxis)
});

Related

How to place the bars of a bar chart in the right positions of the xAxis using d3.js?

I'm making a bar chart but I'm having problems to match the bar positions with the xAxis. They're not in the right place, for example, by hovering the bar above the 2010 mark, you can see it shows a 2007 value. How can I fix that?
let url = "https://raw.githubusercontent.com/freeCodeCamp/ProjectReferenceData/master/GDP-data.json";
const padding = 50;
const height = 460;
const width = 940;
const barthickness = 2.909090909090909;
var svg = d3.select('body')
.append('svg')
.attr('width', width)
.attr('height', height);
var arr = [];
var years = [];
d3.json(url, function(data) {
for (let i = 0; i < data.data.length; i++) {
arr[i] = data.data[i];
years[i] = parseInt(data.data[i][0].slice(0,4));
}
const yScale = d3.scaleLinear()
.domain([0, d3.max(arr, (d) => d[1])])
.range([height - padding, padding]);
const xScale = d3.scaleLinear()
.domain([d3.min(years, d => d), d3.max(years, (d) => d)])
.range([padding, width - padding]);
const xAxis = d3.axisBottom(xScale);
const yAxis = d3.axisLeft(yScale);
svg.append("g")
.attr("transform", "translate(0," + (height - padding) + ")")
.call(xAxis);
svg.append('g')
.attr('transform', 'translate(' + padding + ', 0)')
.call(yAxis)
svg.selectAll('rect')
.data(arr)
.enter()
.append('rect')
.attr('fill', 'blue')
.attr('height', d => height - padding - yScale(d[1]))
.attr('width', barthickness)
.attr('x', (d, i) => padding + (3.2* i))
.attr('y', d => yScale(d[1]))
.append('title')
.text((d, i) => years[i] + ': ' + d[1])
});
<script src="https://d3js.org/d3.v4.min.js"></script>

The problem is that you are not using your x-scale to position the bars. You are using padding + (3.2* i) to set the x coordinate of the bars, which does not line up with your scale. Your chart is 840 pixels wide and has 275 bars, which would be ~3.055 pixels per bar. Your code is placing bars every 3.2 pixels, which is too far.
Typically with bar charts, rather than hard-coding a bar thickness, you use a band scale. You'll want to use your scales both in your axes and to position the bars.
Alternatively, since you are working with temporal data, you could also consider using an area chart instead of a bar chart.
Below I've provided two similarly looking charts for your data. One is a bar chart and the other an area chart.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="https://d3js.org/d3.v7.js"></script>
</head>
<body>
<div id="bar-chart"></div>
<div id="area-chart"></div>
<script>
const url = 'https://raw.githubusercontent.com/freeCodeCamp/ProjectReferenceData/master/GDP-data.json';
d3.json(url).then(json => {
// convert the string into Date objects
const parse = d3.timeParse('%Y-%m-%d');
const data = json.data.map(d => ({ date: parse(d[0]), value: d[1] }));
barchart(data);
areachart(data);
});
function barchart(data) {
// set up
const margin = { top: 20, right: 20, bottom: 20, left: 30 };
const width = 600 - margin.left - margin.right;
const height = 300 - margin.top - margin.bottom;
const svg = d3.select('#bar-chart')
.append('svg')
.attr('width', width + margin.left + margin.right)
.attr('height', height + margin.top + margin.bottom)
.append('g')
.attr('transform', `translate(${margin.left},${margin.top})`);
// scales
const x = d3.scaleBand()
.domain(data.map(d => d.date))
.range([0, width]);
const y = d3.scaleLinear()
.domain([0, d3.max(data, d => d.value)])
.range([height, 0]);
// axes
// by default, axes for band scales show tick marks for every bar
// that would be too cluttered for this data, so we override this
// by explicitly setting tickValues()
const [minDate, maxDate] = d3.extent(data, d => d.date);
const xAxis = d3.axisBottom(x)
.tickSizeOuter(0)
// only show the year in the tick labels
.tickFormat(d3.timeFormat('%Y'))
.tickValues(d3.timeTicks(minDate, maxDate, 10));
const yAxis = d3.axisLeft(y)
.tickSizeOuter(0)
.ticks(10, '~s');
svg.append('g')
.attr('transform', `translate(0,${height})`)
.call(xAxis);
svg.append('g')
.call(yAxis);
// bars
// function to convert Date into string showing the month and year
const format = d3.timeFormat('%b %Y');
svg.selectAll('rect')
.data(data)
.join('rect')
.attr('x', d => x(d.date))
.attr('width', d => x.bandwidth())
.attr('y', d => y(d.value))
.attr('height', d => height - y(d.value))
.attr('fill', 'steelblue')
.append('title')
.text(d => `${format(d.date)}: ${d.value}`)
}
function areachart(data) {
// set up
const margin = { top: 20, right: 20, bottom: 20, left: 30 };
const width = 600 - margin.left - margin.right;
const height = 300 - margin.top - margin.bottom;
const svg = d3.select('#area-chart')
.append('svg')
.attr('width', width + margin.left + margin.right)
.attr('height', height + margin.top + margin.bottom)
.append('g')
.attr('transform', `translate(${margin.left},${margin.top})`);
// scales
const x = d3.scaleTime()
.domain(d3.extent(data, d => d.date))
.range([0, width]);
const y = d3.scaleLinear()
.domain([0, d3.max(data, d => d.value)])
.range([height, 0]);
// area generator
const area = d3.area()
.x(d => x(d.date))
.y0(y(0))
.y1(d => y(d.value))
.curve(d3.curveStepAfter);
// axes
const xAxis = d3.axisBottom(x)
.tickSizeOuter(0)
// only show the year in the tick labels
.tickFormat(d3.timeFormat('%Y'));
const yAxis = d3.axisLeft(y)
.tickSizeOuter(0)
.ticks(10, '~s');
svg.append('g')
.attr('transform', `translate(0,${height})`)
.call(xAxis);
svg.append('g')
.call(yAxis);
// area
svg.append('path')
.attr('d', area(data))
.attr('fill', 'steelblue')
}
</script>
</body>
</html>

How to Size D3 Contours

I want to resize a contour such that it fills to the size of its enclosing container. This post seems to say that I need to give the SVG a viewBox in order for it to know how to properly display the contour. If that is the appropriate course of action, how can I change other elements (such as axes) so they keep an appropriate size.
My current attempt is below which creates a contour out of a 50x50 array at threshold 0.
data = [[-69.776,-70.206,-70.503,-70.68,-70.75,-70.724,-70.613,-70.427,-70.174,-69.863,-69.501,-69.095,-68.652,-68.178,-67.676,-67.153,-66.613,-66.058,-65.492,-64.919,-64.339,-63.757,-63.172,-62.586,-62.001,-61.416,-60.831,-60.247,-59.662,-59.075,-58.486,-57.891,-57.289,-56.678,-56.052,-55.41,-54.747,-54.058,-53.337,-52.58,-51.778,-50.926,-50.016,-49.038,-47.983,-46.841,-45.602,-44.252,-42.779,-41.169],[-57.953,-58.222,-58.386,-58.455,-58.439,-58.348,-58.19,-57.973,-57.704,-57.39,-57.037,-56.65,-56.234,-55.795,-55.336,-54.861,-54.374,-53.877,-53.373,-52.864,-52.352,-51.84,-51.327,-50.815,-50.304,-49.794,-49.286,-48.779,-48.271,-47.761,-47.249,-46.73,-46.204,-45.667,-45.114,-44.543,-43.948,-43.325,-42.666,-41.967,-41.219,-40.415,-39.545,-38.601,-37.571,-36.444,-35.208,-33.849,-32.352,-30.702],[-48.121,-48.242,-48.283,-48.253,-48.159,-48.009,-47.808,-47.564,-47.281,-46.965,-46.62,-46.25,-45.86,-45.454,-45.033,-44.603,-44.164,-43.719,-43.271,-42.82,-42.37,-41.919,-41.471,-41.024,-40.58,-40.137,-39.697,-39.257,-38.817,-38.376,-37.93,-37.478,-37.018,-36.545,-36.055,-35.545,-35.008,-34.44,-33.833,-33.181,-32.476,-31.708,-30.868,-29.945,-28.928,-27.804,-26.559,-25.178,-23.644,-21.939],[-40.002,-39.986,-39.914,-39.793,-39.628,-39.424,-39.185,-38.916,-38.621,-38.303,-37.967,-37.614,-37.248,-36.871,-36.486,-36.095,-35.7,-35.303,-34.904,-34.507,-34.11,-33.716,-33.324,-32.935,-32.55,-32.167,-31.786,-31.406,-31.025,-30.643,-30.256,-29.862,-29.458,-29.04,-28.604,-28.145,-27.657,-27.135,-26.57,-25.956,-25.283,-24.541,-23.721,-22.809,-21.794,-20.661,-19.395,-17.98,-16.396,-14.625],[-33.348,-33.205,-33.03,-32.826,-32.595,-32.342,-32.069,-31.778,-31.473,-31.154,-30.826,-30.488,-30.144,-29.795,-29.442,-29.087,-28.732,-28.377,-28.023,-27.672,-27.324,-26.979,-26.638,-26.3,-25.966,-25.635,-25.306,-24.978,-24.649,-24.318,-23.982,-23.638,-23.282,-22.912,-22.521,-22.105,-21.657,-21.172,-20.64,-20.054,-19.404,-18.68,-17.869,-16.959,-15.936,-14.784,-13.486,-12.025,-10.38,-8.53],[-27.939,-27.68,-27.409,-27.129,-26.839,-26.541,-26.237,-25.927,-25.612,-25.294,-24.973,-24.65,-24.326,-24.001,-23.678,-23.356,-23.036,-22.719,-22.405,-22.095,-21.789,-21.488,-21.191,-20.899,-20.61,-20.324,-20.04,-19.757,-19.473,-19.186,-18.893,-18.592,-18.277,-17.946,-17.593,-17.212,-16.797,-16.34,-15.834,-15.268,-14.633,-13.917,-13.107,-12.189,-11.148,-9.967,-8.628,-7.11,-5.393,-3.452],[-23.58,-23.214,-22.856,-22.506,-22.162,-21.825,-21.493,-21.165,-20.843,-20.525,-20.211,-19.901,-19.595,-19.293,-18.996,-18.703,-18.415,-18.131,-17.853,-17.579,-17.311,-17.048,-16.79,-16.537,-16.287,-16.04,-15.796,-15.551,-15.306,-15.056,-14.8,-14.534,-14.254,-13.956,-13.633,-13.281,-12.891,-12.456,-11.967,-11.414,-10.786,-10.07,-9.253,-8.319,-7.251,-6.032,-4.642,-3.058,-1.258,0.785],[-20.102,-19.638,-19.2,-18.786,-18.393,-18.019,-17.662,-17.32,-16.99,-16.672,-16.365,-16.067,-15.778,-15.497,-15.223,-14.956,-14.696,-14.442,-14.195,-13.953,-13.718,-13.488,-13.264,-13.044,-12.828,-12.615,-12.404,-12.193,-11.979,-11.762,-11.536,-11.3,-11.049,-10.777,-10.479,-10.148,-9.777,-9.358,-8.88,-8.333,-7.705,-6.982,-6.15,-5.192,-4.09,-2.824,-1.373,0.286,2.179,4.334],[-17.356,-16.801,-16.29,-15.818,-15.381,-14.974,-14.594,-14.238,-13.903,-13.586,-13.285,-12.998,-12.724,-12.46,-12.207,-11.964,-11.728,-11.501,-11.28,-11.067,-10.86,-10.659,-10.464,-10.273,-10.086,-9.901,-9.718,-9.535,-9.349,-9.158,-8.958,-8.746,-8.518,-8.267,-7.988,-7.674,-7.316,-6.906,-6.433,-5.886,-5.251,-4.515,-3.661,-2.671,-1.527,-0.207,1.312,3.056,5.052,7.329],[-15.213,-14.575,-13.997,-13.472,-12.995,-12.558,-12.158,-11.79,-11.449,-11.133,-10.838,-10.561,-10.3,-10.053,-9.818,-9.595,-9.381,-9.176,-8.98,-8.79,-8.608,-8.432,-8.261,-8.095,-7.932,-7.772,-7.613,-7.453,-7.29,-7.12,-6.942,-6.749,-6.539,-6.304,-6.039,-5.736,-5.387,-4.981,-4.507,-3.954,-3.307,-2.551,-1.668,-0.641,0.553,1.935,3.531,5.368,7.475,9.884],[-13.562,-12.848,-12.209,-11.636,-11.121,-10.658,-10.24,-9.861,-9.516,-9.2,-8.91,-8.642,-8.393,-8.16,-7.942,-7.737,-7.542,-7.357,-7.18,-7.012,-6.85,-6.695,-6.545,-6.4,-6.258,-6.118,-5.979,-5.838,-5.693,-5.541,-5.379,-5.202,-5.006,-4.783,-4.528,-4.231,-3.885,-3.479,-3,-2.435,-1.771,-0.989,-0.072,1,2.249,3.701,5.382,7.32,9.548,12.099],[-12.308,-11.524,-10.829,-10.212,-9.664,-9.177,-8.742,-8.354,-8.005,-7.69,-7.405,-7.145,-6.906,-6.687,-6.483,-6.292,-6.114,-5.946,-5.787,-5.636,-5.492,-5.355,-5.222,-5.094,-4.969,-4.846,-4.723,-4.598,-4.468,-4.331,-4.182,-4.016,-3.83,-3.615,-3.365,-3.072,-2.725,-2.313,-1.824,-1.244,-0.557,0.256,1.212,2.335,3.647,5.175,6.948,8.996,11.352,14.055],[-11.37,-10.523,-9.777,-9.12,-8.542,-8.033,-7.584,-7.187,-6.834,-6.521,-6.24,-5.987,-5.757,-5.549,-5.357,-5.18,-5.016,-4.862,-4.718,-4.582,-4.453,-4.33,-4.213,-4.099,-3.988,-3.878,-3.768,-3.656,-3.538,-3.411,-3.272,-3.115,-2.935,-2.725,-2.478,-2.183,-1.832,-1.411,-0.908,-0.308,0.407,1.255,2.257,3.436,4.817,6.428,8.3,10.465,12.959,15.822],[-10.683,-9.777,-8.984,-8.291,-7.686,-7.157,-6.695,-6.29,-5.935,-5.622,-5.345,-5.098,-4.877,-4.678,-4.497,-4.331,-4.179,-4.038,-3.906,-3.782,-3.666,-3.555,-3.45,-3.348,-3.248,-3.149,-3.05,-2.947,-2.838,-2.72,-2.588,-2.436,-2.26,-2.052,-1.804,-1.505,-1.145,-0.712,-0.191,0.433,1.18,2.068,3.12,4.361,5.817,7.518,9.496,11.786,14.428,17.461],[-10.188,-9.229,-8.394,-7.668,-7.038,-6.492,-6.018,-5.607,-5.249,-4.936,-4.663,-4.421,-4.207,-4.016,-3.845,-3.689,-3.547,-3.416,-3.294,-3.181,-3.075,-2.974,-2.878,-2.786,-2.695,-2.605,-2.514,-2.418,-2.316,-2.204,-2.076,-1.928,-1.753,-1.544,-1.292,-0.986,-0.616,-0.167,0.376,1.028,1.811,2.744,3.852,5.159,6.696,8.493,10.585,13.009,15.805,19.018],[-9.842,-8.833,-7.96,-7.204,-6.552,-5.99,-5.506,-5.089,-4.728,-4.416,-4.146,-3.909,-3.701,-3.517,-3.353,-3.206,-3.072,-2.95,-2.837,-2.732,-2.634,-2.542,-2.453,-2.368,-2.285,-2.202,-2.116,-2.027,-1.929,-1.82,-1.695,-1.548,-1.373,-1.16,-0.902,-0.587,-0.202,0.266,0.833,1.517,2.34,3.322,4.49,5.87,7.494,9.394,11.607,14.172,17.132,20.534],[-9.605,-8.552,-7.644,-6.861,-6.189,-5.613,-5.12,-4.697,-4.335,-4.023,-3.755,-3.523,-3.32,-3.142,-2.985,-2.845,-2.718,-2.603,-2.497,-2.399,-2.307,-2.221,-2.139,-2.06,-1.982,-1.904,-1.823,-1.737,-1.643,-1.536,-1.412,-1.264,-1.085,-0.867,-0.601,-0.273,0.128,0.617,1.212,1.932,2.799,3.835,5.067,6.526,8.242,10.252,12.593,15.307,18.441,22.042],[-9.45,-8.356,-7.416,-6.609,-5.919,-5.33,-4.828,-4.401,-4.037,-3.726,-3.46,-3.231,-3.033,-2.861,-2.709,-2.574,-2.453,-2.344,-2.244,-2.151,-2.065,-1.984,-1.907,-1.832,-1.758,-1.683,-1.606,-1.522,-1.43,-1.323,-1.198,-1.048,-0.865,-0.64,-0.362,-0.021,0.399,0.913,1.54,2.298,3.212,4.307,5.609,7.151,8.967,11.093,13.57,16.443,19.759,23.57],[-9.353,-8.222,-7.252,-6.423,-5.717,-5.117,-4.608,-4.176,-3.811,-3.5,-3.236,-3.01,-2.816,-2.648,-2.501,-2.371,-2.255,-2.15,-2.055,-1.967,-1.885,-1.807,-1.734,-1.662,-1.591,-1.519,-1.444,-1.361,-1.269,-1.162,-1.035,-0.88,-0.691,-0.457,-0.167,0.191,0.632,1.174,1.834,2.636,3.601,4.758,6.136,7.767,9.688,11.938,14.559,17.599,21.108,25.14],[-9.295,-8.131,-7.134,-6.286,-5.565,-4.955,-4.439,-4.004,-3.637,-3.327,-3.065,-2.842,-2.651,-2.486,-2.343,-2.217,-2.105,-2.004,-1.912,-1.827,-1.748,-1.674,-1.603,-1.534,-1.465,-1.395,-1.32,-1.238,-1.145,-1.036,-0.906,-0.746,-0.549,-0.304,0,0.377,0.842,1.414,2.112,2.959,3.981,5.205,6.663,8.39,10.423,12.804,15.578,18.794,22.506,26.771],[-9.265,-8.069,-7.049,-6.182,-5.448,-4.829,-4.308,-3.869,-3.501,-3.192,-2.931,-2.71,-2.522,-2.361,-2.221,-2.098,-1.989,-1.891,-1.802,-1.72,-1.644,-1.571,-1.502,-1.435,-1.367,-1.298,-1.223,-1.141,-1.046,-0.934,-0.799,-0.633,-0.426,-0.169,0.151,0.549,1.041,1.645,2.384,3.281,4.363,5.66,7.204,9.033,11.185,13.705,16.641,20.043,23.969,28.48],[-9.251,-8.027,-6.985,-6.102,-5.357,-4.729,-4.203,-3.762,-3.393,-3.084,-2.824,-2.605,-2.42,-2.261,-2.124,-2.004,-1.897,-1.802,-1.715,-1.635,-1.56,-1.49,-1.422,-1.356,-1.289,-1.219,-1.144,-1.06,-0.963,-0.848,-0.707,-0.533,-0.316,-0.044,0.294,0.715,1.236,1.877,2.66,3.611,4.758,6.133,7.769,9.706,11.986,14.654,17.761,21.36,25.513,30.281],[-9.248,-7.998,-6.937,-6.039,-5.283,-4.648,-4.117,-3.674,-3.304,-2.995,-2.737,-2.52,-2.336,-2.18,-2.045,-1.927,-1.823,-1.729,-1.644,-1.565,-1.492,-1.423,-1.356,-1.29,-1.223,-1.153,-1.077,-0.991,-0.891,-0.77,-0.623,-0.439,-0.21,0.077,0.436,0.883,1.436,2.116,2.948,3.957,5.175,6.632,8.368,10.421,12.835,15.661,18.949,22.757,27.148,32.189],[-9.25,-7.976,-6.897,-5.986,-5.221,-4.58,-4.045,-3.6,-3.229,-2.921,-2.664,-2.448,-2.266,-2.112,-1.979,-1.862,-1.76,-1.668,-1.584,-1.506,-1.434,-1.365,-1.299,-1.233,-1.165,-1.094,-1.017,-0.928,-0.823,-0.697,-0.542,-0.348,-0.105,0.2,0.582,1.057,1.646,2.369,3.254,4.326,5.619,7.167,9.008,11.185,13.744,16.736,20.217,24.247,28.89,34.218],[-9.254,-7.959,-6.864,-5.941,-5.167,-4.521,-3.982,-3.535,-3.164,-2.856,-2.6,-2.386,-2.206,-2.053,-1.921,-1.806,-1.705,-1.614,-1.531,-1.455,-1.383,-1.314,-1.248,-1.181,-1.113,-1.04,-0.96,-0.868,-0.758,-0.625,-0.46,-0.254,0.005,0.33,0.737,1.243,1.871,2.642,3.583,4.725,6.099,7.743,9.698,12.007,14.721,17.891,21.577,25.841,30.751,36.382],[-9.259,-7.945,-6.834,-5.901,-5.119,-4.468,-3.927,-3.478,-3.106,-2.799,-2.543,-2.331,-2.152,-2,-1.87,-1.756,-1.656,-1.566,-1.483,-1.407,-1.336,-1.267,-1.2,-1.133,-1.063,-0.988,-0.905,-0.808,-0.692,-0.551,-0.375,-0.155,0.122,0.469,0.905,1.446,2.116,2.939,3.943,5.159,6.622,8.371,10.447,12.899,15.777,19.137,23.041,27.553,32.747,38.698],[-9.263,-7.93,-6.807,-5.864,-5.075,-4.419,-3.875,-3.425,-3.054,-2.746,-2.492,-2.28,-2.102,-1.952,-1.822,-1.71,-1.61,-1.52,-1.439,-1.363,-1.291,-1.222,-1.154,-1.085,-1.014,-0.936,-0.848,-0.746,-0.623,-0.472,-0.284,-0.047,0.25,0.623,1.09,1.671,2.388,3.268,4.34,5.637,7.196,9.057,11.265,13.87,16.924,20.487,24.622,29.399,34.893,41.183],[-9.264,-7.916,-6.78,-5.828,-5.033,-4.374,-3.827,-3.376,-3.004,-2.697,-2.443,-2.232,-2.055,-1.906,-1.777,-1.665,-1.566,-1.477,-1.395,-1.318,-1.246,-1.176,-1.107,-1.036,-0.962,-0.88,-0.787,-0.678,-0.546,-0.384,-0.181,0.074,0.395,0.797,1.299,1.923,2.692,3.635,4.782,6.168,7.831,9.814,12.164,14.932,18.175,21.955,26.337,31.395,37.208,43.858],[-9.263,-7.9,-6.752,-5.792,-4.993,-4.329,-3.781,-3.328,-2.956,-2.649,-2.396,-2.186,-2.01,-1.861,-1.733,-1.621,-1.522,-1.432,-1.35,-1.273,-1.2,-1.128,-1.057,-0.983,-0.905,-0.819,-0.719,-0.602,-0.46,-0.283,-0.063,0.213,0.56,0.995,1.537,2.209,3.037,4.049,5.278,6.761,8.537,10.652,13.155,16.1,19.546,23.557,28.203,33.561,39.711,46.743],[-9.258,-7.881,-6.724,-5.756,-4.951,-4.284,-3.734,-3.281,-2.908,-2.602,-2.349,-2.139,-1.963,-1.814,-1.687,-1.575,-1.475,-1.385,-1.302,-1.224,-1.149,-1.075,-1.001,-0.924,-0.841,-0.748,-0.641,-0.513,-0.358,-0.165,0.075,0.376,0.754,1.226,1.813,2.539,3.431,4.519,5.839,7.427,9.327,11.585,14.253,17.388,21.052,25.312,30.24,35.917,42.427,49.863],[-9.249,-7.859,-6.692,-5.718,-4.908,-4.238,-3.686,-3.232,-2.859,-2.553,-2.3,-2.09,-1.914,-1.765,-1.637,-1.525,-1.425,-1.334,-1.249,-1.169,-1.091,-1.015,-0.936,-0.854,-0.765,-0.664,-0.547,-0.407,-0.236,-0.025,0.239,0.569,0.982,1.496,2.134,2.92,3.884,5.057,6.476,8.18,10.215,12.628,15.476,18.816,22.714,27.24,32.47,38.488,45.381,53.246],[-9.235,-7.832,-6.657,-5.676,-4.862,-4.189,-3.635,-3.18,-2.807,-2.5,-2.247,-2.037,-1.861,-1.711,-1.583,-1.469,-1.368,-1.275,-1.188,-1.105,-1.024,-0.943,-0.859,-0.77,-0.673,-0.562,-0.433,-0.278,-0.088,0.146,0.437,0.8,1.253,1.815,2.51,3.365,4.408,5.675,7.203,9.035,11.216,13.799,16.841,20.403,24.553,29.364,34.917,41.298,48.6,56.922],[-9.214,-7.801,-6.617,-5.63,-4.812,-4.136,-3.58,-3.124,-2.75,-2.442,-2.188,-1.978,-1.801,-1.65,-1.52,-1.405,-1.301,-1.206,-1.115,-1.029,-0.943,-0.856,-0.765,-0.668,-0.561,-0.437,-0.293,-0.12,0.092,0.353,0.676,1.078,1.577,2.194,2.953,3.884,5.017,6.387,8.036,10.007,12.349,15.116,18.368,22.169,26.591,31.71,37.609,44.378,52.114,60.922],[-9.187,-7.763,-6.571,-5.579,-4.757,-4.078,-3.52,-3.062,-2.687,-2.378,-2.123,-1.911,-1.733,-1.581,-1.448,-1.33,-1.223,-1.124,-1.029,-0.937,-0.845,-0.751,-0.651,-0.543,-0.423,-0.284,-0.122,0.074,0.312,0.604,0.965,1.411,1.963,2.642,3.475,4.49,5.723,7.209,8.99,11.114,13.632,16.6,20.08,24.14,28.855,34.303,40.573,47.757,55.957,65.282],[-9.155,-7.721,-6.521,-5.523,-4.697,-4.015,-3.455,-2.995,-2.617,-2.307,-2.051,-1.837,-1.656,-1.501,-1.365,-1.244,-1.132,-1.028,-0.927,-0.828,-0.727,-0.623,-0.512,-0.391,-0.255,-0.098,0.088,0.309,0.579,0.908,1.313,1.81,2.422,3.172,4.087,5.198,6.541,8.155,10.084,12.376,15.085,18.272,22,26.34,31.37,37.173,43.84,51.469,60.164,70.038],[-9.118,-7.674,-6.467,-5.463,-4.632,-3.947,-3.384,-2.922,-2.542,-2.229,-1.97,-1.754,-1.57,-1.411,-1.271,-1.144,-1.027,-0.915,-0.807,-0.698,-0.587,-0.471,-0.346,-0.208,-0.052,0.128,0.34,0.593,0.9,1.272,1.728,2.285,2.965,3.795,4.803,6.021,7.488,9.243,11.334,13.811,16.73,20.155,24.151,28.795,34.165,40.35,47.443,55.547,64.77,75.23],[-9.08,-7.626,-6.412,-5.402,-4.567,-3.878,-3.311,-2.846,-2.463,-2.147,-1.884,-1.664,-1.475,-1.311,-1.165,-1.032,-0.906,-0.786,-0.668,-0.548,-0.423,-0.292,-0.149,0.01,0.189,0.397,0.641,0.932,1.281,1.704,2.218,2.843,3.603,4.523,5.635,6.974,8.578,10.49,12.759,15.439,18.588,22.272,26.56,31.532,37.269,43.864,51.415,60.027,69.814,80.898],[-9.046,-7.583,-6.361,-5.345,-4.504,-3.811,-3.24,-2.771,-2.384,-2.064,-1.796,-1.57,-1.376,-1.205,-1.051,-0.909,-0.774,-0.642,-0.511,-0.377,-0.236,-0.085,0.079,0.263,0.471,0.712,0.994,1.329,1.729,2.211,2.792,3.495,4.344,5.367,6.597,8.069,9.826,11.911,14.377,17.28,20.68,24.646,29.252,34.577,40.711,47.748,55.789,64.945,75.334,87.084],[-9.024,-7.551,-6.322,-5.299,-4.453,-3.754,-3.179,-2.704,-2.312,-1.986,-1.713,-1.48,-1.277,-1.098,-0.934,-0.781,-0.634,-0.488,-0.341,-0.188,-0.027,0.147,0.337,0.551,0.793,1.073,1.401,1.787,2.247,2.796,3.455,4.247,5.197,6.336,7.697,9.32,11.246,13.523,16.206,19.352,23.027,27.3,32.25,37.959,44.52,52.031,60.599,70.337,81.37,93.828],[-9.027,-7.544,-6.306,-5.276,-4.424,-3.719,-3.137,-2.656,-2.258,-1.925,-1.643,-1.401,-1.189,-0.999,-0.823,-0.656,-0.493,-0.33,-0.163,0.011,0.197,0.399,0.621,0.871,1.154,1.48,1.86,2.307,2.835,3.463,4.211,5.103,6.168,7.437,8.946,10.735,12.849,15.339,18.26,21.674,25.648,30.255,35.578,41.703,48.724,56.746,65.878,76.24,87.958,101.171],[-9.069,-7.576,-6.329,-5.292,-4.432,-3.72,-3.131,-2.642,-2.235,-1.893,-1.602,-1.349,-1.125,-0.921,-0.729,-0.545,-0.364,-0.18,0.011,0.212,0.428,0.663,0.923,1.215,1.546,1.927,2.369,2.885,3.492,4.209,5.059,6.066,7.26,8.675,10.349,12.323,14.646,17.37,20.553,24.259,28.56,33.531,39.258,45.831,53.349,61.92,71.657,82.686,95.138,109.155],[-9.174,-7.67,-6.414,-5.367,-4.498,-3.778,-3.18,-2.682,-2.265,-1.912,-1.608,-1.342,-1.103,-0.882,-0.672,-0.467,-0.263,-0.053,0.166,0.399,0.65,0.925,1.23,1.572,1.96,2.404,2.917,3.514,4.212,5.031,5.995,7.132,8.472,10.051,11.908,14.089,16.642,19.623,23.093,27.12,31.776,37.143,43.308,50.365,58.419,67.579,77.966,89.708,102.942,117.816],[-9.369,-7.854,-6.586,-5.53,-4.651,-3.92,-3.312,-2.803,-2.373,-2.006,-1.688,-1.405,-1.148,-0.907,-0.674,-0.445,-0.213,0.027,0.28,0.551,0.844,1.166,1.524,1.924,2.378,2.896,3.491,4.18,4.982,5.917,7.012,8.294,9.798,11.559,13.621,16.03,18.837,22.102,25.887,30.263,35.307,41.103,47.742,55.323,63.953,73.747,84.83,97.334,111.404,127.19],[-9.69,-8.162,-6.883,-5.815,-4.924,-4.182,-3.56,-3.038,-2.593,-2.21,-1.874,-1.571,-1.292,-1.027,-0.768,-0.509,-0.244,0.033,0.326,0.641,0.984,1.361,1.779,2.248,2.778,3.38,4.07,4.865,5.784,6.851,8.093,9.539,11.226,13.191,15.479,18.14,21.228,24.804,28.934,33.692,39.158,45.419,52.571,60.716,69.966,80.441,92.269,105.589,120.55,137.308],[-10.181,-8.64,-7.347,-6.266,-5.362,-4.605,-3.969,-3.43,-2.968,-2.565,-2.207,-1.881,-1.576,-1.282,-0.991,-0.697,-0.394,-0.074,0.266,0.633,1.034,1.475,1.964,2.512,3.129,3.828,4.626,5.541,6.594,7.809,9.216,10.846,12.736,14.928,17.468,20.407,23.804,27.72,32.227,37.401,43.325,50.091,57.797,66.551,76.468,87.673,100.3,114.491,130.402,148.194],[-10.898,-9.341,-8.034,-6.938,-6.018,-5.245,-4.591,-4.032,-3.549,-3.124,-2.74,-2.386,-2.05,-1.722,-1.394,-1.059,-0.71,-0.341,0.054,0.482,0.95,1.465,2.036,2.674,3.391,4.201,5.122,6.172,7.376,8.758,10.35,12.185,14.303,16.746,19.563,22.809,26.544,30.834,35.753,41.379,47.801,55.113,63.418,72.827,83.461,95.449,108.93,124.053,140.976,159.869],[-11.905,-10.332,-9.008,-7.895,-6.957,-6.165,-5.49,-4.909,-4.401,-3.948,-3.535,-3.148,-2.776,-2.408,-2.037,-1.654,-1.252,-0.825,-0.366,0.132,0.677,1.277,1.942,2.683,3.514,4.45,5.51,6.714,8.087,9.656,11.455,13.518,15.888,18.608,21.732,25.315,29.422,34.12,39.486,45.605,52.566,60.468,69.419,79.534,90.939,103.766,118.161,134.277,152.279,172.343],[-13.283,-11.691,-10.349,-9.216,-8.258,-7.443,-6.743,-6.136,-5.599,-5.115,-4.667,-4.241,-3.827,-3.413,-2.991,-2.553,-2.09,-1.596,-1.064,-0.485,0.148,0.845,1.617,2.475,3.436,4.514,5.73,7.107,8.67,10.449,12.478,14.795,17.443,20.47,23.931,27.884,32.396,37.54,43.394,50.047,57.592,66.132,75.779,86.654,98.884,112.611,127.982,145.159,164.31,185.619],[-15.125,-13.513,-12.149,-10.994,-10.011,-9.171,-8.443,-7.805,-7.235,-6.714,-6.225,-5.755,-5.292,-4.826,-4.345,-3.843,-3.31,-2.739,-2.123,-1.452,-0.718,0.09,0.983,1.974,3.081,4.319,5.712,7.282,9.057,11.069,13.353,15.951,18.906,22.271,26.102,30.461,35.417,41.045,47.43,54.662,62.838,72.067,82.464,94.154,107.271,121.96,138.375,156.681,177.057,199.688],[-17.541,-15.906,-14.518,-13.337,-12.328,-11.457,-10.697,-10.024,-9.415,-8.851,-8.316,-7.795,-7.276,-6.748,-6.2,-5.625,-5.012,-4.354,-3.641,-2.866,-2.017,-1.084,-0.054,1.088,2.358,3.777,5.366,7.152,9.163,11.434,14.001,16.909,20.204,23.94,28.176,32.978,38.417,44.574,51.534,59.392,68.251,78.222,89.426,101.991,116.058,131.775,149.304,168.816,190.493,214.529]]
var data_width = data[0].length;
var data_height = data.length;
var margin = { top: 20, right: 20, bottom: 40, left: 40 };
var height = 300 - margin.top - margin.bottom;
var width = 300 - margin.left - margin.right;
const hypothesis = [].concat.apply([], data);
var xScale = d3.scaleLinear()
.domain([0, 1000])
.range([0, width]);
var xAxis = d3.axisBottom(xScale).ticks(10);
var yScale = d3.scaleLinear()
.domain([0, 1000])
.range([height, 0]);
var yAxis = d3.axisLeft(yScale).ticks(10);
var svg = d3.select('#container')
.append('svg')
// .attr("viewBox", [0, 0, 50, 50]) This does not give my intended behavior
.attr("width", 300)
.attr("height", 300)
var chartArea = svg.append('g')
.attr('id','chart-area')
.attr('transform', `translate(${margin.left},${margin.top})`);
svg.select('#chart-area')
.append('g')
.attr('class', 'x-axis')
.attr('transform', `translate(0, ${height})`)
.call(xAxis);
svg.select('#chart-area')
.append('g')
.attr('class', 'y-axis')
.call(yAxis);
const path = d3.geoPath();
const contours = d3.contours().size([50, 50])
.thresholds([0]);
var g = chartArea.append("g")
.attr("stroke", "black")
.attr("stroke-width", 0.5)
.attr("fill", "none");
g.selectAll(null)
.data(contours(hypothesis))
.enter()
.append("path")
.attr("d", path);
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/5.7.0/d3.min.js"></script>
<div id="container">
</div>

I normally never add a second answer (I usually edit the first one instead), but this is a specific situation: in the first answer I said that adding a custom projection would be a lot of work... well, I stand corrected: using a projection is actually way easier than my proposed solution with d3.line().
Here's all you need (set the fitSize array according to your needs):
const projection = d3.geoIdentity()
.fitSize([200,200], contours(hypothesis)[0])
Then, just pass that projection to d3.geoPath():
const path = d3.geoPath()
.projection(projection);
And here is your code with that change only:
data = [[-69.776,-70.206,-70.503,-70.68,-70.75,-70.724,-70.613,-70.427,-70.174,-69.863,-69.501,-69.095,-68.652,-68.178,-67.676,-67.153,-66.613,-66.058,-65.492,-64.919,-64.339,-63.757,-63.172,-62.586,-62.001,-61.416,-60.831,-60.247,-59.662,-59.075,-58.486,-57.891,-57.289,-56.678,-56.052,-55.41,-54.747,-54.058,-53.337,-52.58,-51.778,-50.926,-50.016,-49.038,-47.983,-46.841,-45.602,-44.252,-42.779,-41.169],[-57.953,-58.222,-58.386,-58.455,-58.439,-58.348,-58.19,-57.973,-57.704,-57.39,-57.037,-56.65,-56.234,-55.795,-55.336,-54.861,-54.374,-53.877,-53.373,-52.864,-52.352,-51.84,-51.327,-50.815,-50.304,-49.794,-49.286,-48.779,-48.271,-47.761,-47.249,-46.73,-46.204,-45.667,-45.114,-44.543,-43.948,-43.325,-42.666,-41.967,-41.219,-40.415,-39.545,-38.601,-37.571,-36.444,-35.208,-33.849,-32.352,-30.702],[-48.121,-48.242,-48.283,-48.253,-48.159,-48.009,-47.808,-47.564,-47.281,-46.965,-46.62,-46.25,-45.86,-45.454,-45.033,-44.603,-44.164,-43.719,-43.271,-42.82,-42.37,-41.919,-41.471,-41.024,-40.58,-40.137,-39.697,-39.257,-38.817,-38.376,-37.93,-37.478,-37.018,-36.545,-36.055,-35.545,-35.008,-34.44,-33.833,-33.181,-32.476,-31.708,-30.868,-29.945,-28.928,-27.804,-26.559,-25.178,-23.644,-21.939],[-40.002,-39.986,-39.914,-39.793,-39.628,-39.424,-39.185,-38.916,-38.621,-38.303,-37.967,-37.614,-37.248,-36.871,-36.486,-36.095,-35.7,-35.303,-34.904,-34.507,-34.11,-33.716,-33.324,-32.935,-32.55,-32.167,-31.786,-31.406,-31.025,-30.643,-30.256,-29.862,-29.458,-29.04,-28.604,-28.145,-27.657,-27.135,-26.57,-25.956,-25.283,-24.541,-23.721,-22.809,-21.794,-20.661,-19.395,-17.98,-16.396,-14.625],[-33.348,-33.205,-33.03,-32.826,-32.595,-32.342,-32.069,-31.778,-31.473,-31.154,-30.826,-30.488,-30.144,-29.795,-29.442,-29.087,-28.732,-28.377,-28.023,-27.672,-27.324,-26.979,-26.638,-26.3,-25.966,-25.635,-25.306,-24.978,-24.649,-24.318,-23.982,-23.638,-23.282,-22.912,-22.521,-22.105,-21.657,-21.172,-20.64,-20.054,-19.404,-18.68,-17.869,-16.959,-15.936,-14.784,-13.486,-12.025,-10.38,-8.53],[-27.939,-27.68,-27.409,-27.129,-26.839,-26.541,-26.237,-25.927,-25.612,-25.294,-24.973,-24.65,-24.326,-24.001,-23.678,-23.356,-23.036,-22.719,-22.405,-22.095,-21.789,-21.488,-21.191,-20.899,-20.61,-20.324,-20.04,-19.757,-19.473,-19.186,-18.893,-18.592,-18.277,-17.946,-17.593,-17.212,-16.797,-16.34,-15.834,-15.268,-14.633,-13.917,-13.107,-12.189,-11.148,-9.967,-8.628,-7.11,-5.393,-3.452],[-23.58,-23.214,-22.856,-22.506,-22.162,-21.825,-21.493,-21.165,-20.843,-20.525,-20.211,-19.901,-19.595,-19.293,-18.996,-18.703,-18.415,-18.131,-17.853,-17.579,-17.311,-17.048,-16.79,-16.537,-16.287,-16.04,-15.796,-15.551,-15.306,-15.056,-14.8,-14.534,-14.254,-13.956,-13.633,-13.281,-12.891,-12.456,-11.967,-11.414,-10.786,-10.07,-9.253,-8.319,-7.251,-6.032,-4.642,-3.058,-1.258,0.785],[-20.102,-19.638,-19.2,-18.786,-18.393,-18.019,-17.662,-17.32,-16.99,-16.672,-16.365,-16.067,-15.778,-15.497,-15.223,-14.956,-14.696,-14.442,-14.195,-13.953,-13.718,-13.488,-13.264,-13.044,-12.828,-12.615,-12.404,-12.193,-11.979,-11.762,-11.536,-11.3,-11.049,-10.777,-10.479,-10.148,-9.777,-9.358,-8.88,-8.333,-7.705,-6.982,-6.15,-5.192,-4.09,-2.824,-1.373,0.286,2.179,4.334],[-17.356,-16.801,-16.29,-15.818,-15.381,-14.974,-14.594,-14.238,-13.903,-13.586,-13.285,-12.998,-12.724,-12.46,-12.207,-11.964,-11.728,-11.501,-11.28,-11.067,-10.86,-10.659,-10.464,-10.273,-10.086,-9.901,-9.718,-9.535,-9.349,-9.158,-8.958,-8.746,-8.518,-8.267,-7.988,-7.674,-7.316,-6.906,-6.433,-5.886,-5.251,-4.515,-3.661,-2.671,-1.527,-0.207,1.312,3.056,5.052,7.329],[-15.213,-14.575,-13.997,-13.472,-12.995,-12.558,-12.158,-11.79,-11.449,-11.133,-10.838,-10.561,-10.3,-10.053,-9.818,-9.595,-9.381,-9.176,-8.98,-8.79,-8.608,-8.432,-8.261,-8.095,-7.932,-7.772,-7.613,-7.453,-7.29,-7.12,-6.942,-6.749,-6.539,-6.304,-6.039,-5.736,-5.387,-4.981,-4.507,-3.954,-3.307,-2.551,-1.668,-0.641,0.553,1.935,3.531,5.368,7.475,9.884],[-13.562,-12.848,-12.209,-11.636,-11.121,-10.658,-10.24,-9.861,-9.516,-9.2,-8.91,-8.642,-8.393,-8.16,-7.942,-7.737,-7.542,-7.357,-7.18,-7.012,-6.85,-6.695,-6.545,-6.4,-6.258,-6.118,-5.979,-5.838,-5.693,-5.541,-5.379,-5.202,-5.006,-4.783,-4.528,-4.231,-3.885,-3.479,-3,-2.435,-1.771,-0.989,-0.072,1,2.249,3.701,5.382,7.32,9.548,12.099],[-12.308,-11.524,-10.829,-10.212,-9.664,-9.177,-8.742,-8.354,-8.005,-7.69,-7.405,-7.145,-6.906,-6.687,-6.483,-6.292,-6.114,-5.946,-5.787,-5.636,-5.492,-5.355,-5.222,-5.094,-4.969,-4.846,-4.723,-4.598,-4.468,-4.331,-4.182,-4.016,-3.83,-3.615,-3.365,-3.072,-2.725,-2.313,-1.824,-1.244,-0.557,0.256,1.212,2.335,3.647,5.175,6.948,8.996,11.352,14.055],[-11.37,-10.523,-9.777,-9.12,-8.542,-8.033,-7.584,-7.187,-6.834,-6.521,-6.24,-5.987,-5.757,-5.549,-5.357,-5.18,-5.016,-4.862,-4.718,-4.582,-4.453,-4.33,-4.213,-4.099,-3.988,-3.878,-3.768,-3.656,-3.538,-3.411,-3.272,-3.115,-2.935,-2.725,-2.478,-2.183,-1.832,-1.411,-0.908,-0.308,0.407,1.255,2.257,3.436,4.817,6.428,8.3,10.465,12.959,15.822],[-10.683,-9.777,-8.984,-8.291,-7.686,-7.157,-6.695,-6.29,-5.935,-5.622,-5.345,-5.098,-4.877,-4.678,-4.497,-4.331,-4.179,-4.038,-3.906,-3.782,-3.666,-3.555,-3.45,-3.348,-3.248,-3.149,-3.05,-2.947,-2.838,-2.72,-2.588,-2.436,-2.26,-2.052,-1.804,-1.505,-1.145,-0.712,-0.191,0.433,1.18,2.068,3.12,4.361,5.817,7.518,9.496,11.786,14.428,17.461],[-10.188,-9.229,-8.394,-7.668,-7.038,-6.492,-6.018,-5.607,-5.249,-4.936,-4.663,-4.421,-4.207,-4.016,-3.845,-3.689,-3.547,-3.416,-3.294,-3.181,-3.075,-2.974,-2.878,-2.786,-2.695,-2.605,-2.514,-2.418,-2.316,-2.204,-2.076,-1.928,-1.753,-1.544,-1.292,-0.986,-0.616,-0.167,0.376,1.028,1.811,2.744,3.852,5.159,6.696,8.493,10.585,13.009,15.805,19.018],[-9.842,-8.833,-7.96,-7.204,-6.552,-5.99,-5.506,-5.089,-4.728,-4.416,-4.146,-3.909,-3.701,-3.517,-3.353,-3.206,-3.072,-2.95,-2.837,-2.732,-2.634,-2.542,-2.453,-2.368,-2.285,-2.202,-2.116,-2.027,-1.929,-1.82,-1.695,-1.548,-1.373,-1.16,-0.902,-0.587,-0.202,0.266,0.833,1.517,2.34,3.322,4.49,5.87,7.494,9.394,11.607,14.172,17.132,20.534],[-9.605,-8.552,-7.644,-6.861,-6.189,-5.613,-5.12,-4.697,-4.335,-4.023,-3.755,-3.523,-3.32,-3.142,-2.985,-2.845,-2.718,-2.603,-2.497,-2.399,-2.307,-2.221,-2.139,-2.06,-1.982,-1.904,-1.823,-1.737,-1.643,-1.536,-1.412,-1.264,-1.085,-0.867,-0.601,-0.273,0.128,0.617,1.212,1.932,2.799,3.835,5.067,6.526,8.242,10.252,12.593,15.307,18.441,22.042],[-9.45,-8.356,-7.416,-6.609,-5.919,-5.33,-4.828,-4.401,-4.037,-3.726,-3.46,-3.231,-3.033,-2.861,-2.709,-2.574,-2.453,-2.344,-2.244,-2.151,-2.065,-1.984,-1.907,-1.832,-1.758,-1.683,-1.606,-1.522,-1.43,-1.323,-1.198,-1.048,-0.865,-0.64,-0.362,-0.021,0.399,0.913,1.54,2.298,3.212,4.307,5.609,7.151,8.967,11.093,13.57,16.443,19.759,23.57],[-9.353,-8.222,-7.252,-6.423,-5.717,-5.117,-4.608,-4.176,-3.811,-3.5,-3.236,-3.01,-2.816,-2.648,-2.501,-2.371,-2.255,-2.15,-2.055,-1.967,-1.885,-1.807,-1.734,-1.662,-1.591,-1.519,-1.444,-1.361,-1.269,-1.162,-1.035,-0.88,-0.691,-0.457,-0.167,0.191,0.632,1.174,1.834,2.636,3.601,4.758,6.136,7.767,9.688,11.938,14.559,17.599,21.108,25.14],[-9.295,-8.131,-7.134,-6.286,-5.565,-4.955,-4.439,-4.004,-3.637,-3.327,-3.065,-2.842,-2.651,-2.486,-2.343,-2.217,-2.105,-2.004,-1.912,-1.827,-1.748,-1.674,-1.603,-1.534,-1.465,-1.395,-1.32,-1.238,-1.145,-1.036,-0.906,-0.746,-0.549,-0.304,0,0.377,0.842,1.414,2.112,2.959,3.981,5.205,6.663,8.39,10.423,12.804,15.578,18.794,22.506,26.771],[-9.265,-8.069,-7.049,-6.182,-5.448,-4.829,-4.308,-3.869,-3.501,-3.192,-2.931,-2.71,-2.522,-2.361,-2.221,-2.098,-1.989,-1.891,-1.802,-1.72,-1.644,-1.571,-1.502,-1.435,-1.367,-1.298,-1.223,-1.141,-1.046,-0.934,-0.799,-0.633,-0.426,-0.169,0.151,0.549,1.041,1.645,2.384,3.281,4.363,5.66,7.204,9.033,11.185,13.705,16.641,20.043,23.969,28.48],[-9.251,-8.027,-6.985,-6.102,-5.357,-4.729,-4.203,-3.762,-3.393,-3.084,-2.824,-2.605,-2.42,-2.261,-2.124,-2.004,-1.897,-1.802,-1.715,-1.635,-1.56,-1.49,-1.422,-1.356,-1.289,-1.219,-1.144,-1.06,-0.963,-0.848,-0.707,-0.533,-0.316,-0.044,0.294,0.715,1.236,1.877,2.66,3.611,4.758,6.133,7.769,9.706,11.986,14.654,17.761,21.36,25.513,30.281],[-9.248,-7.998,-6.937,-6.039,-5.283,-4.648,-4.117,-3.674,-3.304,-2.995,-2.737,-2.52,-2.336,-2.18,-2.045,-1.927,-1.823,-1.729,-1.644,-1.565,-1.492,-1.423,-1.356,-1.29,-1.223,-1.153,-1.077,-0.991,-0.891,-0.77,-0.623,-0.439,-0.21,0.077,0.436,0.883,1.436,2.116,2.948,3.957,5.175,6.632,8.368,10.421,12.835,15.661,18.949,22.757,27.148,32.189],[-9.25,-7.976,-6.897,-5.986,-5.221,-4.58,-4.045,-3.6,-3.229,-2.921,-2.664,-2.448,-2.266,-2.112,-1.979,-1.862,-1.76,-1.668,-1.584,-1.506,-1.434,-1.365,-1.299,-1.233,-1.165,-1.094,-1.017,-0.928,-0.823,-0.697,-0.542,-0.348,-0.105,0.2,0.582,1.057,1.646,2.369,3.254,4.326,5.619,7.167,9.008,11.185,13.744,16.736,20.217,24.247,28.89,34.218],[-9.254,-7.959,-6.864,-5.941,-5.167,-4.521,-3.982,-3.535,-3.164,-2.856,-2.6,-2.386,-2.206,-2.053,-1.921,-1.806,-1.705,-1.614,-1.531,-1.455,-1.383,-1.314,-1.248,-1.181,-1.113,-1.04,-0.96,-0.868,-0.758,-0.625,-0.46,-0.254,0.005,0.33,0.737,1.243,1.871,2.642,3.583,4.725,6.099,7.743,9.698,12.007,14.721,17.891,21.577,25.841,30.751,36.382],[-9.259,-7.945,-6.834,-5.901,-5.119,-4.468,-3.927,-3.478,-3.106,-2.799,-2.543,-2.331,-2.152,-2,-1.87,-1.756,-1.656,-1.566,-1.483,-1.407,-1.336,-1.267,-1.2,-1.133,-1.063,-0.988,-0.905,-0.808,-0.692,-0.551,-0.375,-0.155,0.122,0.469,0.905,1.446,2.116,2.939,3.943,5.159,6.622,8.371,10.447,12.899,15.777,19.137,23.041,27.553,32.747,38.698],[-9.263,-7.93,-6.807,-5.864,-5.075,-4.419,-3.875,-3.425,-3.054,-2.746,-2.492,-2.28,-2.102,-1.952,-1.822,-1.71,-1.61,-1.52,-1.439,-1.363,-1.291,-1.222,-1.154,-1.085,-1.014,-0.936,-0.848,-0.746,-0.623,-0.472,-0.284,-0.047,0.25,0.623,1.09,1.671,2.388,3.268,4.34,5.637,7.196,9.057,11.265,13.87,16.924,20.487,24.622,29.399,34.893,41.183],[-9.264,-7.916,-6.78,-5.828,-5.033,-4.374,-3.827,-3.376,-3.004,-2.697,-2.443,-2.232,-2.055,-1.906,-1.777,-1.665,-1.566,-1.477,-1.395,-1.318,-1.246,-1.176,-1.107,-1.036,-0.962,-0.88,-0.787,-0.678,-0.546,-0.384,-0.181,0.074,0.395,0.797,1.299,1.923,2.692,3.635,4.782,6.168,7.831,9.814,12.164,14.932,18.175,21.955,26.337,31.395,37.208,43.858],[-9.263,-7.9,-6.752,-5.792,-4.993,-4.329,-3.781,-3.328,-2.956,-2.649,-2.396,-2.186,-2.01,-1.861,-1.733,-1.621,-1.522,-1.432,-1.35,-1.273,-1.2,-1.128,-1.057,-0.983,-0.905,-0.819,-0.719,-0.602,-0.46,-0.283,-0.063,0.213,0.56,0.995,1.537,2.209,3.037,4.049,5.278,6.761,8.537,10.652,13.155,16.1,19.546,23.557,28.203,33.561,39.711,46.743],[-9.258,-7.881,-6.724,-5.756,-4.951,-4.284,-3.734,-3.281,-2.908,-2.602,-2.349,-2.139,-1.963,-1.814,-1.687,-1.575,-1.475,-1.385,-1.302,-1.224,-1.149,-1.075,-1.001,-0.924,-0.841,-0.748,-0.641,-0.513,-0.358,-0.165,0.075,0.376,0.754,1.226,1.813,2.539,3.431,4.519,5.839,7.427,9.327,11.585,14.253,17.388,21.052,25.312,30.24,35.917,42.427,49.863],[-9.249,-7.859,-6.692,-5.718,-4.908,-4.238,-3.686,-3.232,-2.859,-2.553,-2.3,-2.09,-1.914,-1.765,-1.637,-1.525,-1.425,-1.334,-1.249,-1.169,-1.091,-1.015,-0.936,-0.854,-0.765,-0.664,-0.547,-0.407,-0.236,-0.025,0.239,0.569,0.982,1.496,2.134,2.92,3.884,5.057,6.476,8.18,10.215,12.628,15.476,18.816,22.714,27.24,32.47,38.488,45.381,53.246],[-9.235,-7.832,-6.657,-5.676,-4.862,-4.189,-3.635,-3.18,-2.807,-2.5,-2.247,-2.037,-1.861,-1.711,-1.583,-1.469,-1.368,-1.275,-1.188,-1.105,-1.024,-0.943,-0.859,-0.77,-0.673,-0.562,-0.433,-0.278,-0.088,0.146,0.437,0.8,1.253,1.815,2.51,3.365,4.408,5.675,7.203,9.035,11.216,13.799,16.841,20.403,24.553,29.364,34.917,41.298,48.6,56.922],[-9.214,-7.801,-6.617,-5.63,-4.812,-4.136,-3.58,-3.124,-2.75,-2.442,-2.188,-1.978,-1.801,-1.65,-1.52,-1.405,-1.301,-1.206,-1.115,-1.029,-0.943,-0.856,-0.765,-0.668,-0.561,-0.437,-0.293,-0.12,0.092,0.353,0.676,1.078,1.577,2.194,2.953,3.884,5.017,6.387,8.036,10.007,12.349,15.116,18.368,22.169,26.591,31.71,37.609,44.378,52.114,60.922],[-9.187,-7.763,-6.571,-5.579,-4.757,-4.078,-3.52,-3.062,-2.687,-2.378,-2.123,-1.911,-1.733,-1.581,-1.448,-1.33,-1.223,-1.124,-1.029,-0.937,-0.845,-0.751,-0.651,-0.543,-0.423,-0.284,-0.122,0.074,0.312,0.604,0.965,1.411,1.963,2.642,3.475,4.49,5.723,7.209,8.99,11.114,13.632,16.6,20.08,24.14,28.855,34.303,40.573,47.757,55.957,65.282],[-9.155,-7.721,-6.521,-5.523,-4.697,-4.015,-3.455,-2.995,-2.617,-2.307,-2.051,-1.837,-1.656,-1.501,-1.365,-1.244,-1.132,-1.028,-0.927,-0.828,-0.727,-0.623,-0.512,-0.391,-0.255,-0.098,0.088,0.309,0.579,0.908,1.313,1.81,2.422,3.172,4.087,5.198,6.541,8.155,10.084,12.376,15.085,18.272,22,26.34,31.37,37.173,43.84,51.469,60.164,70.038],[-9.118,-7.674,-6.467,-5.463,-4.632,-3.947,-3.384,-2.922,-2.542,-2.229,-1.97,-1.754,-1.57,-1.411,-1.271,-1.144,-1.027,-0.915,-0.807,-0.698,-0.587,-0.471,-0.346,-0.208,-0.052,0.128,0.34,0.593,0.9,1.272,1.728,2.285,2.965,3.795,4.803,6.021,7.488,9.243,11.334,13.811,16.73,20.155,24.151,28.795,34.165,40.35,47.443,55.547,64.77,75.23],[-9.08,-7.626,-6.412,-5.402,-4.567,-3.878,-3.311,-2.846,-2.463,-2.147,-1.884,-1.664,-1.475,-1.311,-1.165,-1.032,-0.906,-0.786,-0.668,-0.548,-0.423,-0.292,-0.149,0.01,0.189,0.397,0.641,0.932,1.281,1.704,2.218,2.843,3.603,4.523,5.635,6.974,8.578,10.49,12.759,15.439,18.588,22.272,26.56,31.532,37.269,43.864,51.415,60.027,69.814,80.898],[-9.046,-7.583,-6.361,-5.345,-4.504,-3.811,-3.24,-2.771,-2.384,-2.064,-1.796,-1.57,-1.376,-1.205,-1.051,-0.909,-0.774,-0.642,-0.511,-0.377,-0.236,-0.085,0.079,0.263,0.471,0.712,0.994,1.329,1.729,2.211,2.792,3.495,4.344,5.367,6.597,8.069,9.826,11.911,14.377,17.28,20.68,24.646,29.252,34.577,40.711,47.748,55.789,64.945,75.334,87.084],[-9.024,-7.551,-6.322,-5.299,-4.453,-3.754,-3.179,-2.704,-2.312,-1.986,-1.713,-1.48,-1.277,-1.098,-0.934,-0.781,-0.634,-0.488,-0.341,-0.188,-0.027,0.147,0.337,0.551,0.793,1.073,1.401,1.787,2.247,2.796,3.455,4.247,5.197,6.336,7.697,9.32,11.246,13.523,16.206,19.352,23.027,27.3,32.25,37.959,44.52,52.031,60.599,70.337,81.37,93.828],[-9.027,-7.544,-6.306,-5.276,-4.424,-3.719,-3.137,-2.656,-2.258,-1.925,-1.643,-1.401,-1.189,-0.999,-0.823,-0.656,-0.493,-0.33,-0.163,0.011,0.197,0.399,0.621,0.871,1.154,1.48,1.86,2.307,2.835,3.463,4.211,5.103,6.168,7.437,8.946,10.735,12.849,15.339,18.26,21.674,25.648,30.255,35.578,41.703,48.724,56.746,65.878,76.24,87.958,101.171],[-9.069,-7.576,-6.329,-5.292,-4.432,-3.72,-3.131,-2.642,-2.235,-1.893,-1.602,-1.349,-1.125,-0.921,-0.729,-0.545,-0.364,-0.18,0.011,0.212,0.428,0.663,0.923,1.215,1.546,1.927,2.369,2.885,3.492,4.209,5.059,6.066,7.26,8.675,10.349,12.323,14.646,17.37,20.553,24.259,28.56,33.531,39.258,45.831,53.349,61.92,71.657,82.686,95.138,109.155],[-9.174,-7.67,-6.414,-5.367,-4.498,-3.778,-3.18,-2.682,-2.265,-1.912,-1.608,-1.342,-1.103,-0.882,-0.672,-0.467,-0.263,-0.053,0.166,0.399,0.65,0.925,1.23,1.572,1.96,2.404,2.917,3.514,4.212,5.031,5.995,7.132,8.472,10.051,11.908,14.089,16.642,19.623,23.093,27.12,31.776,37.143,43.308,50.365,58.419,67.579,77.966,89.708,102.942,117.816],[-9.369,-7.854,-6.586,-5.53,-4.651,-3.92,-3.312,-2.803,-2.373,-2.006,-1.688,-1.405,-1.148,-0.907,-0.674,-0.445,-0.213,0.027,0.28,0.551,0.844,1.166,1.524,1.924,2.378,2.896,3.491,4.18,4.982,5.917,7.012,8.294,9.798,11.559,13.621,16.03,18.837,22.102,25.887,30.263,35.307,41.103,47.742,55.323,63.953,73.747,84.83,97.334,111.404,127.19],[-9.69,-8.162,-6.883,-5.815,-4.924,-4.182,-3.56,-3.038,-2.593,-2.21,-1.874,-1.571,-1.292,-1.027,-0.768,-0.509,-0.244,0.033,0.326,0.641,0.984,1.361,1.779,2.248,2.778,3.38,4.07,4.865,5.784,6.851,8.093,9.539,11.226,13.191,15.479,18.14,21.228,24.804,28.934,33.692,39.158,45.419,52.571,60.716,69.966,80.441,92.269,105.589,120.55,137.308],[-10.181,-8.64,-7.347,-6.266,-5.362,-4.605,-3.969,-3.43,-2.968,-2.565,-2.207,-1.881,-1.576,-1.282,-0.991,-0.697,-0.394,-0.074,0.266,0.633,1.034,1.475,1.964,2.512,3.129,3.828,4.626,5.541,6.594,7.809,9.216,10.846,12.736,14.928,17.468,20.407,23.804,27.72,32.227,37.401,43.325,50.091,57.797,66.551,76.468,87.673,100.3,114.491,130.402,148.194],[-10.898,-9.341,-8.034,-6.938,-6.018,-5.245,-4.591,-4.032,-3.549,-3.124,-2.74,-2.386,-2.05,-1.722,-1.394,-1.059,-0.71,-0.341,0.054,0.482,0.95,1.465,2.036,2.674,3.391,4.201,5.122,6.172,7.376,8.758,10.35,12.185,14.303,16.746,19.563,22.809,26.544,30.834,35.753,41.379,47.801,55.113,63.418,72.827,83.461,95.449,108.93,124.053,140.976,159.869],[-11.905,-10.332,-9.008,-7.895,-6.957,-6.165,-5.49,-4.909,-4.401,-3.948,-3.535,-3.148,-2.776,-2.408,-2.037,-1.654,-1.252,-0.825,-0.366,0.132,0.677,1.277,1.942,2.683,3.514,4.45,5.51,6.714,8.087,9.656,11.455,13.518,15.888,18.608,21.732,25.315,29.422,34.12,39.486,45.605,52.566,60.468,69.419,79.534,90.939,103.766,118.161,134.277,152.279,172.343],[-13.283,-11.691,-10.349,-9.216,-8.258,-7.443,-6.743,-6.136,-5.599,-5.115,-4.667,-4.241,-3.827,-3.413,-2.991,-2.553,-2.09,-1.596,-1.064,-0.485,0.148,0.845,1.617,2.475,3.436,4.514,5.73,7.107,8.67,10.449,12.478,14.795,17.443,20.47,23.931,27.884,32.396,37.54,43.394,50.047,57.592,66.132,75.779,86.654,98.884,112.611,127.982,145.159,164.31,185.619],[-15.125,-13.513,-12.149,-10.994,-10.011,-9.171,-8.443,-7.805,-7.235,-6.714,-6.225,-5.755,-5.292,-4.826,-4.345,-3.843,-3.31,-2.739,-2.123,-1.452,-0.718,0.09,0.983,1.974,3.081,4.319,5.712,7.282,9.057,11.069,13.353,15.951,18.906,22.271,26.102,30.461,35.417,41.045,47.43,54.662,62.838,72.067,82.464,94.154,107.271,121.96,138.375,156.681,177.057,199.688],[-17.541,-15.906,-14.518,-13.337,-12.328,-11.457,-10.697,-10.024,-9.415,-8.851,-8.316,-7.795,-7.276,-6.748,-6.2,-5.625,-5.012,-4.354,-3.641,-2.866,-2.017,-1.084,-0.054,1.088,2.358,3.777,5.366,7.152,9.163,11.434,14.001,16.909,20.204,23.94,28.176,32.978,38.417,44.574,51.534,59.392,68.251,78.222,89.426,101.991,116.058,131.775,149.304,168.816,190.493,214.529]]
var data_width = data[0].length;
var data_height = data.length;
var margin = { top: 20, right: 20, bottom: 40, left: 40 };
var height = 300 - margin.top - margin.bottom;
var width = 300 - margin.left - margin.right;
const hypothesis = [].concat.apply([], data);
var xScale = d3.scaleLinear()
.domain([0, 1000])
.range([0, width]);
var xAxis = d3.axisBottom(xScale).ticks(10);
var yScale = d3.scaleLinear()
.domain([0, 1000])
.range([height, 0]);
var yAxis = d3.axisLeft(yScale).ticks(10);
var svg = d3.select('#container')
.append('svg')
// .attr("viewBox", [0, 0, 50, 50]) This does not give my intended behavior
.attr("width", 300)
.attr("height", 300)
var chartArea = svg.append('g')
.attr('id','chart-area')
.attr('transform', `translate(${margin.left},${margin.top})`);
svg.select('#chart-area')
.append('g')
.attr('class', 'x-axis')
.attr('transform', `translate(0, ${height})`)
.call(xAxis);
svg.select('#chart-area')
.append('g')
.attr('class', 'y-axis')
.call(yAxis);
const contours = d3.contours().size([50, 50])
.thresholds([0]);
const projection = d3.geoIdentity()
.fitSize([200,200], contours(hypothesis)[0])
const path = d3.geoPath()
.projection(projection);
var g = chartArea.append("g")
.attr("stroke", "black")
.attr("stroke-width", 0.5)
.attr("fill", "none");
g.selectAll(null)
.data(contours(hypothesis))
.enter()
.append("path")
.attr("d", path);
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/5.7.0/d3.min.js"></script>
<div id="container">
</div>

d3.contours has no method for setting the size of the contours: the width and height of the matrix correspond to the positions created by the contour generator.
You're currently passing those positions to d3.geoPath(), which also has no method for setting the size of the generated path. You could pass a custom projection to d3.geoPath and then using projection.fitSize or projection.fitExtent to stretch the paths the way you want, but it seems a lot of work to me.
An easy alternative is dropping d3.geoPath() and using a line generator with a scale. In the scale you use the width/height of the matrix (since in your case they are the same, we will use just one scale) as the domain, and set your range as desired:
const scale = d3.scaleLinear()
.domain([0, 50])
.range([0, 200]);
const line = d3.line()
.x(d=>scale(d[0]))
.y(d=>scale(d[1]));
Then, in the paths, use the coordinates array:
g.selectAll(null)
.data(contours(hypothesis))
.enter()
.append("path")
.attr("d", d=>line(d.coordinates[0][0]));
Here is your code with those changes:
data = [[-69.776,-70.206,-70.503,-70.68,-70.75,-70.724,-70.613,-70.427,-70.174,-69.863,-69.501,-69.095,-68.652,-68.178,-67.676,-67.153,-66.613,-66.058,-65.492,-64.919,-64.339,-63.757,-63.172,-62.586,-62.001,-61.416,-60.831,-60.247,-59.662,-59.075,-58.486,-57.891,-57.289,-56.678,-56.052,-55.41,-54.747,-54.058,-53.337,-52.58,-51.778,-50.926,-50.016,-49.038,-47.983,-46.841,-45.602,-44.252,-42.779,-41.169],[-57.953,-58.222,-58.386,-58.455,-58.439,-58.348,-58.19,-57.973,-57.704,-57.39,-57.037,-56.65,-56.234,-55.795,-55.336,-54.861,-54.374,-53.877,-53.373,-52.864,-52.352,-51.84,-51.327,-50.815,-50.304,-49.794,-49.286,-48.779,-48.271,-47.761,-47.249,-46.73,-46.204,-45.667,-45.114,-44.543,-43.948,-43.325,-42.666,-41.967,-41.219,-40.415,-39.545,-38.601,-37.571,-36.444,-35.208,-33.849,-32.352,-30.702],[-48.121,-48.242,-48.283,-48.253,-48.159,-48.009,-47.808,-47.564,-47.281,-46.965,-46.62,-46.25,-45.86,-45.454,-45.033,-44.603,-44.164,-43.719,-43.271,-42.82,-42.37,-41.919,-41.471,-41.024,-40.58,-40.137,-39.697,-39.257,-38.817,-38.376,-37.93,-37.478,-37.018,-36.545,-36.055,-35.545,-35.008,-34.44,-33.833,-33.181,-32.476,-31.708,-30.868,-29.945,-28.928,-27.804,-26.559,-25.178,-23.644,-21.939],[-40.002,-39.986,-39.914,-39.793,-39.628,-39.424,-39.185,-38.916,-38.621,-38.303,-37.967,-37.614,-37.248,-36.871,-36.486,-36.095,-35.7,-35.303,-34.904,-34.507,-34.11,-33.716,-33.324,-32.935,-32.55,-32.167,-31.786,-31.406,-31.025,-30.643,-30.256,-29.862,-29.458,-29.04,-28.604,-28.145,-27.657,-27.135,-26.57,-25.956,-25.283,-24.541,-23.721,-22.809,-21.794,-20.661,-19.395,-17.98,-16.396,-14.625],[-33.348,-33.205,-33.03,-32.826,-32.595,-32.342,-32.069,-31.778,-31.473,-31.154,-30.826,-30.488,-30.144,-29.795,-29.442,-29.087,-28.732,-28.377,-28.023,-27.672,-27.324,-26.979,-26.638,-26.3,-25.966,-25.635,-25.306,-24.978,-24.649,-24.318,-23.982,-23.638,-23.282,-22.912,-22.521,-22.105,-21.657,-21.172,-20.64,-20.054,-19.404,-18.68,-17.869,-16.959,-15.936,-14.784,-13.486,-12.025,-10.38,-8.53],[-27.939,-27.68,-27.409,-27.129,-26.839,-26.541,-26.237,-25.927,-25.612,-25.294,-24.973,-24.65,-24.326,-24.001,-23.678,-23.356,-23.036,-22.719,-22.405,-22.095,-21.789,-21.488,-21.191,-20.899,-20.61,-20.324,-20.04,-19.757,-19.473,-19.186,-18.893,-18.592,-18.277,-17.946,-17.593,-17.212,-16.797,-16.34,-15.834,-15.268,-14.633,-13.917,-13.107,-12.189,-11.148,-9.967,-8.628,-7.11,-5.393,-3.452],[-23.58,-23.214,-22.856,-22.506,-22.162,-21.825,-21.493,-21.165,-20.843,-20.525,-20.211,-19.901,-19.595,-19.293,-18.996,-18.703,-18.415,-18.131,-17.853,-17.579,-17.311,-17.048,-16.79,-16.537,-16.287,-16.04,-15.796,-15.551,-15.306,-15.056,-14.8,-14.534,-14.254,-13.956,-13.633,-13.281,-12.891,-12.456,-11.967,-11.414,-10.786,-10.07,-9.253,-8.319,-7.251,-6.032,-4.642,-3.058,-1.258,0.785],[-20.102,-19.638,-19.2,-18.786,-18.393,-18.019,-17.662,-17.32,-16.99,-16.672,-16.365,-16.067,-15.778,-15.497,-15.223,-14.956,-14.696,-14.442,-14.195,-13.953,-13.718,-13.488,-13.264,-13.044,-12.828,-12.615,-12.404,-12.193,-11.979,-11.762,-11.536,-11.3,-11.049,-10.777,-10.479,-10.148,-9.777,-9.358,-8.88,-8.333,-7.705,-6.982,-6.15,-5.192,-4.09,-2.824,-1.373,0.286,2.179,4.334],[-17.356,-16.801,-16.29,-15.818,-15.381,-14.974,-14.594,-14.238,-13.903,-13.586,-13.285,-12.998,-12.724,-12.46,-12.207,-11.964,-11.728,-11.501,-11.28,-11.067,-10.86,-10.659,-10.464,-10.273,-10.086,-9.901,-9.718,-9.535,-9.349,-9.158,-8.958,-8.746,-8.518,-8.267,-7.988,-7.674,-7.316,-6.906,-6.433,-5.886,-5.251,-4.515,-3.661,-2.671,-1.527,-0.207,1.312,3.056,5.052,7.329],[-15.213,-14.575,-13.997,-13.472,-12.995,-12.558,-12.158,-11.79,-11.449,-11.133,-10.838,-10.561,-10.3,-10.053,-9.818,-9.595,-9.381,-9.176,-8.98,-8.79,-8.608,-8.432,-8.261,-8.095,-7.932,-7.772,-7.613,-7.453,-7.29,-7.12,-6.942,-6.749,-6.539,-6.304,-6.039,-5.736,-5.387,-4.981,-4.507,-3.954,-3.307,-2.551,-1.668,-0.641,0.553,1.935,3.531,5.368,7.475,9.884],[-13.562,-12.848,-12.209,-11.636,-11.121,-10.658,-10.24,-9.861,-9.516,-9.2,-8.91,-8.642,-8.393,-8.16,-7.942,-7.737,-7.542,-7.357,-7.18,-7.012,-6.85,-6.695,-6.545,-6.4,-6.258,-6.118,-5.979,-5.838,-5.693,-5.541,-5.379,-5.202,-5.006,-4.783,-4.528,-4.231,-3.885,-3.479,-3,-2.435,-1.771,-0.989,-0.072,1,2.249,3.701,5.382,7.32,9.548,12.099],[-12.308,-11.524,-10.829,-10.212,-9.664,-9.177,-8.742,-8.354,-8.005,-7.69,-7.405,-7.145,-6.906,-6.687,-6.483,-6.292,-6.114,-5.946,-5.787,-5.636,-5.492,-5.355,-5.222,-5.094,-4.969,-4.846,-4.723,-4.598,-4.468,-4.331,-4.182,-4.016,-3.83,-3.615,-3.365,-3.072,-2.725,-2.313,-1.824,-1.244,-0.557,0.256,1.212,2.335,3.647,5.175,6.948,8.996,11.352,14.055],[-11.37,-10.523,-9.777,-9.12,-8.542,-8.033,-7.584,-7.187,-6.834,-6.521,-6.24,-5.987,-5.757,-5.549,-5.357,-5.18,-5.016,-4.862,-4.718,-4.582,-4.453,-4.33,-4.213,-4.099,-3.988,-3.878,-3.768,-3.656,-3.538,-3.411,-3.272,-3.115,-2.935,-2.725,-2.478,-2.183,-1.832,-1.411,-0.908,-0.308,0.407,1.255,2.257,3.436,4.817,6.428,8.3,10.465,12.959,15.822],[-10.683,-9.777,-8.984,-8.291,-7.686,-7.157,-6.695,-6.29,-5.935,-5.622,-5.345,-5.098,-4.877,-4.678,-4.497,-4.331,-4.179,-4.038,-3.906,-3.782,-3.666,-3.555,-3.45,-3.348,-3.248,-3.149,-3.05,-2.947,-2.838,-2.72,-2.588,-2.436,-2.26,-2.052,-1.804,-1.505,-1.145,-0.712,-0.191,0.433,1.18,2.068,3.12,4.361,5.817,7.518,9.496,11.786,14.428,17.461],[-10.188,-9.229,-8.394,-7.668,-7.038,-6.492,-6.018,-5.607,-5.249,-4.936,-4.663,-4.421,-4.207,-4.016,-3.845,-3.689,-3.547,-3.416,-3.294,-3.181,-3.075,-2.974,-2.878,-2.786,-2.695,-2.605,-2.514,-2.418,-2.316,-2.204,-2.076,-1.928,-1.753,-1.544,-1.292,-0.986,-0.616,-0.167,0.376,1.028,1.811,2.744,3.852,5.159,6.696,8.493,10.585,13.009,15.805,19.018],[-9.842,-8.833,-7.96,-7.204,-6.552,-5.99,-5.506,-5.089,-4.728,-4.416,-4.146,-3.909,-3.701,-3.517,-3.353,-3.206,-3.072,-2.95,-2.837,-2.732,-2.634,-2.542,-2.453,-2.368,-2.285,-2.202,-2.116,-2.027,-1.929,-1.82,-1.695,-1.548,-1.373,-1.16,-0.902,-0.587,-0.202,0.266,0.833,1.517,2.34,3.322,4.49,5.87,7.494,9.394,11.607,14.172,17.132,20.534],[-9.605,-8.552,-7.644,-6.861,-6.189,-5.613,-5.12,-4.697,-4.335,-4.023,-3.755,-3.523,-3.32,-3.142,-2.985,-2.845,-2.718,-2.603,-2.497,-2.399,-2.307,-2.221,-2.139,-2.06,-1.982,-1.904,-1.823,-1.737,-1.643,-1.536,-1.412,-1.264,-1.085,-0.867,-0.601,-0.273,0.128,0.617,1.212,1.932,2.799,3.835,5.067,6.526,8.242,10.252,12.593,15.307,18.441,22.042],[-9.45,-8.356,-7.416,-6.609,-5.919,-5.33,-4.828,-4.401,-4.037,-3.726,-3.46,-3.231,-3.033,-2.861,-2.709,-2.574,-2.453,-2.344,-2.244,-2.151,-2.065,-1.984,-1.907,-1.832,-1.758,-1.683,-1.606,-1.522,-1.43,-1.323,-1.198,-1.048,-0.865,-0.64,-0.362,-0.021,0.399,0.913,1.54,2.298,3.212,4.307,5.609,7.151,8.967,11.093,13.57,16.443,19.759,23.57],[-9.353,-8.222,-7.252,-6.423,-5.717,-5.117,-4.608,-4.176,-3.811,-3.5,-3.236,-3.01,-2.816,-2.648,-2.501,-2.371,-2.255,-2.15,-2.055,-1.967,-1.885,-1.807,-1.734,-1.662,-1.591,-1.519,-1.444,-1.361,-1.269,-1.162,-1.035,-0.88,-0.691,-0.457,-0.167,0.191,0.632,1.174,1.834,2.636,3.601,4.758,6.136,7.767,9.688,11.938,14.559,17.599,21.108,25.14],[-9.295,-8.131,-7.134,-6.286,-5.565,-4.955,-4.439,-4.004,-3.637,-3.327,-3.065,-2.842,-2.651,-2.486,-2.343,-2.217,-2.105,-2.004,-1.912,-1.827,-1.748,-1.674,-1.603,-1.534,-1.465,-1.395,-1.32,-1.238,-1.145,-1.036,-0.906,-0.746,-0.549,-0.304,0,0.377,0.842,1.414,2.112,2.959,3.981,5.205,6.663,8.39,10.423,12.804,15.578,18.794,22.506,26.771],[-9.265,-8.069,-7.049,-6.182,-5.448,-4.829,-4.308,-3.869,-3.501,-3.192,-2.931,-2.71,-2.522,-2.361,-2.221,-2.098,-1.989,-1.891,-1.802,-1.72,-1.644,-1.571,-1.502,-1.435,-1.367,-1.298,-1.223,-1.141,-1.046,-0.934,-0.799,-0.633,-0.426,-0.169,0.151,0.549,1.041,1.645,2.384,3.281,4.363,5.66,7.204,9.033,11.185,13.705,16.641,20.043,23.969,28.48],[-9.251,-8.027,-6.985,-6.102,-5.357,-4.729,-4.203,-3.762,-3.393,-3.084,-2.824,-2.605,-2.42,-2.261,-2.124,-2.004,-1.897,-1.802,-1.715,-1.635,-1.56,-1.49,-1.422,-1.356,-1.289,-1.219,-1.144,-1.06,-0.963,-0.848,-0.707,-0.533,-0.316,-0.044,0.294,0.715,1.236,1.877,2.66,3.611,4.758,6.133,7.769,9.706,11.986,14.654,17.761,21.36,25.513,30.281],[-9.248,-7.998,-6.937,-6.039,-5.283,-4.648,-4.117,-3.674,-3.304,-2.995,-2.737,-2.52,-2.336,-2.18,-2.045,-1.927,-1.823,-1.729,-1.644,-1.565,-1.492,-1.423,-1.356,-1.29,-1.223,-1.153,-1.077,-0.991,-0.891,-0.77,-0.623,-0.439,-0.21,0.077,0.436,0.883,1.436,2.116,2.948,3.957,5.175,6.632,8.368,10.421,12.835,15.661,18.949,22.757,27.148,32.189],[-9.25,-7.976,-6.897,-5.986,-5.221,-4.58,-4.045,-3.6,-3.229,-2.921,-2.664,-2.448,-2.266,-2.112,-1.979,-1.862,-1.76,-1.668,-1.584,-1.506,-1.434,-1.365,-1.299,-1.233,-1.165,-1.094,-1.017,-0.928,-0.823,-0.697,-0.542,-0.348,-0.105,0.2,0.582,1.057,1.646,2.369,3.254,4.326,5.619,7.167,9.008,11.185,13.744,16.736,20.217,24.247,28.89,34.218],[-9.254,-7.959,-6.864,-5.941,-5.167,-4.521,-3.982,-3.535,-3.164,-2.856,-2.6,-2.386,-2.206,-2.053,-1.921,-1.806,-1.705,-1.614,-1.531,-1.455,-1.383,-1.314,-1.248,-1.181,-1.113,-1.04,-0.96,-0.868,-0.758,-0.625,-0.46,-0.254,0.005,0.33,0.737,1.243,1.871,2.642,3.583,4.725,6.099,7.743,9.698,12.007,14.721,17.891,21.577,25.841,30.751,36.382],[-9.259,-7.945,-6.834,-5.901,-5.119,-4.468,-3.927,-3.478,-3.106,-2.799,-2.543,-2.331,-2.152,-2,-1.87,-1.756,-1.656,-1.566,-1.483,-1.407,-1.336,-1.267,-1.2,-1.133,-1.063,-0.988,-0.905,-0.808,-0.692,-0.551,-0.375,-0.155,0.122,0.469,0.905,1.446,2.116,2.939,3.943,5.159,6.622,8.371,10.447,12.899,15.777,19.137,23.041,27.553,32.747,38.698],[-9.263,-7.93,-6.807,-5.864,-5.075,-4.419,-3.875,-3.425,-3.054,-2.746,-2.492,-2.28,-2.102,-1.952,-1.822,-1.71,-1.61,-1.52,-1.439,-1.363,-1.291,-1.222,-1.154,-1.085,-1.014,-0.936,-0.848,-0.746,-0.623,-0.472,-0.284,-0.047,0.25,0.623,1.09,1.671,2.388,3.268,4.34,5.637,7.196,9.057,11.265,13.87,16.924,20.487,24.622,29.399,34.893,41.183],[-9.264,-7.916,-6.78,-5.828,-5.033,-4.374,-3.827,-3.376,-3.004,-2.697,-2.443,-2.232,-2.055,-1.906,-1.777,-1.665,-1.566,-1.477,-1.395,-1.318,-1.246,-1.176,-1.107,-1.036,-0.962,-0.88,-0.787,-0.678,-0.546,-0.384,-0.181,0.074,0.395,0.797,1.299,1.923,2.692,3.635,4.782,6.168,7.831,9.814,12.164,14.932,18.175,21.955,26.337,31.395,37.208,43.858],[-9.263,-7.9,-6.752,-5.792,-4.993,-4.329,-3.781,-3.328,-2.956,-2.649,-2.396,-2.186,-2.01,-1.861,-1.733,-1.621,-1.522,-1.432,-1.35,-1.273,-1.2,-1.128,-1.057,-0.983,-0.905,-0.819,-0.719,-0.602,-0.46,-0.283,-0.063,0.213,0.56,0.995,1.537,2.209,3.037,4.049,5.278,6.761,8.537,10.652,13.155,16.1,19.546,23.557,28.203,33.561,39.711,46.743],[-9.258,-7.881,-6.724,-5.756,-4.951,-4.284,-3.734,-3.281,-2.908,-2.602,-2.349,-2.139,-1.963,-1.814,-1.687,-1.575,-1.475,-1.385,-1.302,-1.224,-1.149,-1.075,-1.001,-0.924,-0.841,-0.748,-0.641,-0.513,-0.358,-0.165,0.075,0.376,0.754,1.226,1.813,2.539,3.431,4.519,5.839,7.427,9.327,11.585,14.253,17.388,21.052,25.312,30.24,35.917,42.427,49.863],[-9.249,-7.859,-6.692,-5.718,-4.908,-4.238,-3.686,-3.232,-2.859,-2.553,-2.3,-2.09,-1.914,-1.765,-1.637,-1.525,-1.425,-1.334,-1.249,-1.169,-1.091,-1.015,-0.936,-0.854,-0.765,-0.664,-0.547,-0.407,-0.236,-0.025,0.239,0.569,0.982,1.496,2.134,2.92,3.884,5.057,6.476,8.18,10.215,12.628,15.476,18.816,22.714,27.24,32.47,38.488,45.381,53.246],[-9.235,-7.832,-6.657,-5.676,-4.862,-4.189,-3.635,-3.18,-2.807,-2.5,-2.247,-2.037,-1.861,-1.711,-1.583,-1.469,-1.368,-1.275,-1.188,-1.105,-1.024,-0.943,-0.859,-0.77,-0.673,-0.562,-0.433,-0.278,-0.088,0.146,0.437,0.8,1.253,1.815,2.51,3.365,4.408,5.675,7.203,9.035,11.216,13.799,16.841,20.403,24.553,29.364,34.917,41.298,48.6,56.922],[-9.214,-7.801,-6.617,-5.63,-4.812,-4.136,-3.58,-3.124,-2.75,-2.442,-2.188,-1.978,-1.801,-1.65,-1.52,-1.405,-1.301,-1.206,-1.115,-1.029,-0.943,-0.856,-0.765,-0.668,-0.561,-0.437,-0.293,-0.12,0.092,0.353,0.676,1.078,1.577,2.194,2.953,3.884,5.017,6.387,8.036,10.007,12.349,15.116,18.368,22.169,26.591,31.71,37.609,44.378,52.114,60.922],[-9.187,-7.763,-6.571,-5.579,-4.757,-4.078,-3.52,-3.062,-2.687,-2.378,-2.123,-1.911,-1.733,-1.581,-1.448,-1.33,-1.223,-1.124,-1.029,-0.937,-0.845,-0.751,-0.651,-0.543,-0.423,-0.284,-0.122,0.074,0.312,0.604,0.965,1.411,1.963,2.642,3.475,4.49,5.723,7.209,8.99,11.114,13.632,16.6,20.08,24.14,28.855,34.303,40.573,47.757,55.957,65.282],[-9.155,-7.721,-6.521,-5.523,-4.697,-4.015,-3.455,-2.995,-2.617,-2.307,-2.051,-1.837,-1.656,-1.501,-1.365,-1.244,-1.132,-1.028,-0.927,-0.828,-0.727,-0.623,-0.512,-0.391,-0.255,-0.098,0.088,0.309,0.579,0.908,1.313,1.81,2.422,3.172,4.087,5.198,6.541,8.155,10.084,12.376,15.085,18.272,22,26.34,31.37,37.173,43.84,51.469,60.164,70.038],[-9.118,-7.674,-6.467,-5.463,-4.632,-3.947,-3.384,-2.922,-2.542,-2.229,-1.97,-1.754,-1.57,-1.411,-1.271,-1.144,-1.027,-0.915,-0.807,-0.698,-0.587,-0.471,-0.346,-0.208,-0.052,0.128,0.34,0.593,0.9,1.272,1.728,2.285,2.965,3.795,4.803,6.021,7.488,9.243,11.334,13.811,16.73,20.155,24.151,28.795,34.165,40.35,47.443,55.547,64.77,75.23],[-9.08,-7.626,-6.412,-5.402,-4.567,-3.878,-3.311,-2.846,-2.463,-2.147,-1.884,-1.664,-1.475,-1.311,-1.165,-1.032,-0.906,-0.786,-0.668,-0.548,-0.423,-0.292,-0.149,0.01,0.189,0.397,0.641,0.932,1.281,1.704,2.218,2.843,3.603,4.523,5.635,6.974,8.578,10.49,12.759,15.439,18.588,22.272,26.56,31.532,37.269,43.864,51.415,60.027,69.814,80.898],[-9.046,-7.583,-6.361,-5.345,-4.504,-3.811,-3.24,-2.771,-2.384,-2.064,-1.796,-1.57,-1.376,-1.205,-1.051,-0.909,-0.774,-0.642,-0.511,-0.377,-0.236,-0.085,0.079,0.263,0.471,0.712,0.994,1.329,1.729,2.211,2.792,3.495,4.344,5.367,6.597,8.069,9.826,11.911,14.377,17.28,20.68,24.646,29.252,34.577,40.711,47.748,55.789,64.945,75.334,87.084],[-9.024,-7.551,-6.322,-5.299,-4.453,-3.754,-3.179,-2.704,-2.312,-1.986,-1.713,-1.48,-1.277,-1.098,-0.934,-0.781,-0.634,-0.488,-0.341,-0.188,-0.027,0.147,0.337,0.551,0.793,1.073,1.401,1.787,2.247,2.796,3.455,4.247,5.197,6.336,7.697,9.32,11.246,13.523,16.206,19.352,23.027,27.3,32.25,37.959,44.52,52.031,60.599,70.337,81.37,93.828],[-9.027,-7.544,-6.306,-5.276,-4.424,-3.719,-3.137,-2.656,-2.258,-1.925,-1.643,-1.401,-1.189,-0.999,-0.823,-0.656,-0.493,-0.33,-0.163,0.011,0.197,0.399,0.621,0.871,1.154,1.48,1.86,2.307,2.835,3.463,4.211,5.103,6.168,7.437,8.946,10.735,12.849,15.339,18.26,21.674,25.648,30.255,35.578,41.703,48.724,56.746,65.878,76.24,87.958,101.171],[-9.069,-7.576,-6.329,-5.292,-4.432,-3.72,-3.131,-2.642,-2.235,-1.893,-1.602,-1.349,-1.125,-0.921,-0.729,-0.545,-0.364,-0.18,0.011,0.212,0.428,0.663,0.923,1.215,1.546,1.927,2.369,2.885,3.492,4.209,5.059,6.066,7.26,8.675,10.349,12.323,14.646,17.37,20.553,24.259,28.56,33.531,39.258,45.831,53.349,61.92,71.657,82.686,95.138,109.155],[-9.174,-7.67,-6.414,-5.367,-4.498,-3.778,-3.18,-2.682,-2.265,-1.912,-1.608,-1.342,-1.103,-0.882,-0.672,-0.467,-0.263,-0.053,0.166,0.399,0.65,0.925,1.23,1.572,1.96,2.404,2.917,3.514,4.212,5.031,5.995,7.132,8.472,10.051,11.908,14.089,16.642,19.623,23.093,27.12,31.776,37.143,43.308,50.365,58.419,67.579,77.966,89.708,102.942,117.816],[-9.369,-7.854,-6.586,-5.53,-4.651,-3.92,-3.312,-2.803,-2.373,-2.006,-1.688,-1.405,-1.148,-0.907,-0.674,-0.445,-0.213,0.027,0.28,0.551,0.844,1.166,1.524,1.924,2.378,2.896,3.491,4.18,4.982,5.917,7.012,8.294,9.798,11.559,13.621,16.03,18.837,22.102,25.887,30.263,35.307,41.103,47.742,55.323,63.953,73.747,84.83,97.334,111.404,127.19],[-9.69,-8.162,-6.883,-5.815,-4.924,-4.182,-3.56,-3.038,-2.593,-2.21,-1.874,-1.571,-1.292,-1.027,-0.768,-0.509,-0.244,0.033,0.326,0.641,0.984,1.361,1.779,2.248,2.778,3.38,4.07,4.865,5.784,6.851,8.093,9.539,11.226,13.191,15.479,18.14,21.228,24.804,28.934,33.692,39.158,45.419,52.571,60.716,69.966,80.441,92.269,105.589,120.55,137.308],[-10.181,-8.64,-7.347,-6.266,-5.362,-4.605,-3.969,-3.43,-2.968,-2.565,-2.207,-1.881,-1.576,-1.282,-0.991,-0.697,-0.394,-0.074,0.266,0.633,1.034,1.475,1.964,2.512,3.129,3.828,4.626,5.541,6.594,7.809,9.216,10.846,12.736,14.928,17.468,20.407,23.804,27.72,32.227,37.401,43.325,50.091,57.797,66.551,76.468,87.673,100.3,114.491,130.402,148.194],[-10.898,-9.341,-8.034,-6.938,-6.018,-5.245,-4.591,-4.032,-3.549,-3.124,-2.74,-2.386,-2.05,-1.722,-1.394,-1.059,-0.71,-0.341,0.054,0.482,0.95,1.465,2.036,2.674,3.391,4.201,5.122,6.172,7.376,8.758,10.35,12.185,14.303,16.746,19.563,22.809,26.544,30.834,35.753,41.379,47.801,55.113,63.418,72.827,83.461,95.449,108.93,124.053,140.976,159.869],[-11.905,-10.332,-9.008,-7.895,-6.957,-6.165,-5.49,-4.909,-4.401,-3.948,-3.535,-3.148,-2.776,-2.408,-2.037,-1.654,-1.252,-0.825,-0.366,0.132,0.677,1.277,1.942,2.683,3.514,4.45,5.51,6.714,8.087,9.656,11.455,13.518,15.888,18.608,21.732,25.315,29.422,34.12,39.486,45.605,52.566,60.468,69.419,79.534,90.939,103.766,118.161,134.277,152.279,172.343],[-13.283,-11.691,-10.349,-9.216,-8.258,-7.443,-6.743,-6.136,-5.599,-5.115,-4.667,-4.241,-3.827,-3.413,-2.991,-2.553,-2.09,-1.596,-1.064,-0.485,0.148,0.845,1.617,2.475,3.436,4.514,5.73,7.107,8.67,10.449,12.478,14.795,17.443,20.47,23.931,27.884,32.396,37.54,43.394,50.047,57.592,66.132,75.779,86.654,98.884,112.611,127.982,145.159,164.31,185.619],[-15.125,-13.513,-12.149,-10.994,-10.011,-9.171,-8.443,-7.805,-7.235,-6.714,-6.225,-5.755,-5.292,-4.826,-4.345,-3.843,-3.31,-2.739,-2.123,-1.452,-0.718,0.09,0.983,1.974,3.081,4.319,5.712,7.282,9.057,11.069,13.353,15.951,18.906,22.271,26.102,30.461,35.417,41.045,47.43,54.662,62.838,72.067,82.464,94.154,107.271,121.96,138.375,156.681,177.057,199.688],[-17.541,-15.906,-14.518,-13.337,-12.328,-11.457,-10.697,-10.024,-9.415,-8.851,-8.316,-7.795,-7.276,-6.748,-6.2,-5.625,-5.012,-4.354,-3.641,-2.866,-2.017,-1.084,-0.054,1.088,2.358,3.777,5.366,7.152,9.163,11.434,14.001,16.909,20.204,23.94,28.176,32.978,38.417,44.574,51.534,59.392,68.251,78.222,89.426,101.991,116.058,131.775,149.304,168.816,190.493,214.529]]
var data_width = data[0].length;
var data_height = data.length;
var margin = { top: 20, right: 20, bottom: 40, left: 40 };
var height = 300 - margin.top - margin.bottom;
var width = 300 - margin.left - margin.right;
const hypothesis = [].concat.apply([], data);
var xScale = d3.scaleLinear()
.domain([0, 1000])
.range([0, width]);
var xAxis = d3.axisBottom(xScale).ticks(10);
var yScale = d3.scaleLinear()
.domain([0, 1000])
.range([height, 0]);
var yAxis = d3.axisLeft(yScale).ticks(10);
var svg = d3.select('#container')
.append('svg')
// .attr("viewBox", [0, 0, 50, 50]) This does not give my intended behavior
.attr("width", 300)
.attr("height", 300)
var chartArea = svg.append('g')
.attr('id','chart-area')
.attr('transform', `translate(${margin.left},${margin.top})`);
svg.select('#chart-area')
.append('g')
.attr('class', 'x-axis')
.attr('transform', `translate(0, ${height})`)
.call(xAxis);
svg.select('#chart-area')
.append('g')
.attr('class', 'y-axis')
.call(yAxis);
const scale = d3.scaleLinear()
.domain([0, 50])
.range([0, 200]);
const line = d3.line()
.x(d=>scale(d[0]))
.y(d=>scale(d[1]));
const contours = d3.contours().size([50, 50])
.thresholds([0]);
var g = chartArea.append("g")
.attr("stroke", "black")
.attr("stroke-width", 0.5)
.attr("fill", "none");
g.selectAll(null)
.data(contours(hypothesis))
.enter()
.append("path")
.attr("d", d=>line(d.coordinates[0][0]));
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/5.7.0/d3.min.js"></script>
<div id="container">
</div>

D3.js bar chart, bars extending from top to bottom, instead of bottom to top

Barchart image
D3.js bar chart, bars extending from top to bottom, instead of bottom to top.
I am not sure what attributes i should be changing to correct this.
I have posted my code and an image of the resulting chart.
...
const marketCataRender = marketCataData => {
const marketCataSVG = d3.select('.marketCataChart').append('svg')
marketCataSVG.attr('class', 'marketCataSVG')
.attr('height', marketCataHeight)
.attr('width', marketCataWidth);
// x y values
const xValue = d => d.loc_start_str;
const yValue = d => d.total_matched;
// x y scales
const xScale = d3.scaleBand()
.domain(marketCataData.map(xValue))
.range(\[0, innerWidth\]);
const yScale = d3.scaleLinear()
.domain(d3.extent(marketCataData, yValue))
.range(\[innerHeight, 0\])
.nice();
// x y axis
const xAxis = d3.axisBottom(xScale)
const yAxis = d3.axisLeft(yScale)
// set chart group to make it easier to transform
const g = marketCataSVG.append('g')
.attr('transform', `translate(${margin.left}, ${margin.top})`);
// x y axis groups
const xAxisG = g.append('g')
.call(xAxis)
.attr('transform', `translate(0, ${innerHeight})`)
.selectAll('text')
.style('text-anchor', 'end')
.attr('transform', `rotate(-90)`)
.attr('x', -7)
const yAxisG = g.append('g')
.call(yAxis)
// Apply bar chart rectangle to chart
const marketCataRect = g.selectAll('rect')
marketCataRect.data(marketCataData)
.enter().append('rect')
.attr('x', d => xScale(xValue(d)))
.attr('height', d => yScale(yValue(d)))
.attr('width', xScale.bandwidth());
}][1]
...

You haven't declared the Y coordinates for your rectangles.
You need to scale the y coordinate of your rectangles.
const marketCataRect = g.selectAll('rect')
marketCataRect.data(marketCataData)
.enter().append('rect')
.attr('x', d => xScale(d.loc_start_str) )
.attr('y', d => yScale(d.total_matched) ) // set y
.attr('height', d => marketCataHeight - yScale(d.total_matched)) // find height by subtracting y value from height of the chart.
.attr('width', xScale.bandwidth());
example here: https://bl.ocks.org/d3noob/8952219

Try to always provide a Minimal, Complete, and Verifiable example. https://stackoverflow.com/help/mcve
I tried to do this by taking your code and adding dummy data etc. and then modifying it
The result is this (Demo here- https://codepen.io/Alexander9111/pen/gObEZym):
HTML:
<div class="marketCataChart"></div>
<script src="https://d3js.org/d3.v5.min.js"></script>
Javascript:
const marketCataHeight = 800;
const marketCataWidth = 2000;
const innerWidth = 1500;
const innerHeight = 500;
const margin = {
top: 30,
left: 30,
bottom: 30,
right: 30
};
const marketCataRender = marketCataData => {
const marketCataSVG = d3.select('.marketCataChart').append('svg')
marketCataSVG.attr('class', 'marketCataSVG')
.attr('height', marketCataHeight)
.attr('width', marketCataWidth);
// x y values
const xValue = d => d.loc_start_str;
const yValue = d => d.total_matched;
// x y scales
const xScale = d3.scaleBand();
xScale.domain(marketCataData.map(xValue))
.range([0, innerWidth]);
const yScale = d3.scaleLinear();
yScale.domain(d3.extent(marketCataData, yValue))
.range([innerHeight, 0])
.nice();
// x y axis
//const xAxis = d3.axisBottom(xScale)
const xAxis = d3.axisTop(xScale) //change to axisTop
const yAxis = d3.axisLeft(yScale)
// set chart group to make it easier to transform
const g = marketCataSVG.append('g')
.attr('transform', `translate(${margin.left}, ${margin.top})`);
// x y axis groups
const xAxisG = g.append('g')
.call(xAxis)
.attr('class', 'x-axis')
.attr('transform', `translate(0, ${0})`) // no longer need to translate by innerHeight as the x-axis is on the top
.selectAll('text')
.style('text-anchor', 'middle')
.attr('transform', `rotate(-0)`) //-90
.attr('x', -7)
const yAxisG = g.append('g')
.call(yAxis)
.attr('class', 'y-axis');
// Apply bar chart rectangle to chart
const marketCataRect = g.selectAll('rect');
marketCataRect.data(marketCataData)
.enter().append('rect')
.attr('x', d => xScale(xValue(d)))
.attr('height', d => yScale(yValue(d)))
.attr('width', xScale.bandwidth());
//Optional - add chart border:
g.append('rect')
.attr('x', 0)
.attr('y', 0)
.attr('width', innerWidth)
.attr('height', innerHeight)
.attr('stroke', 'black')
.attr('stroke-width', '1px')
.attr('fill', 'none')
.attr('class', 'chart-boarder');
};
const marketCataData = [
{loc_start_str: "example0", total_matched: 0},
{loc_start_str: "example1", total_matched: 100},
{loc_start_str: "example2", total_matched: 200},
{loc_start_str: "example3", total_matched: 300},
{loc_start_str: "example4", total_matched: 400},
]
marketCataRender(marketCataData);
Most important lines were: const xAxis = d3.axisTop(xScale) and const xAxisG.attr('transform', `translate(0, ${0})`)

Y Axis not displaying for scatter plot with d3 v4

I am trying to create a scatter plot with d3.js (v4). I am a newbie in d3, and thanks to the limited documentation of examples with v4, am struggling to create the plot (already have asked here once before). My code is given below:
const margin = { top: 100, right: 50, left: 50, bottom: 50};
const width = 1300 - margin.right - margin.left;
const height = 1250 - margin.top - margin.bottom;
d3.csv("http://localhost:9000/data.csv", (error, data) => {
if (error) throw error;
const x = (d) => d["Category"];
const xScale = d3.scalePoint()
.domain(data.map((d) => d["Category"]))
.range([0, width]);
const xMap = (d) => xScale(x(d));
const xAxis = d3.axisBottom().scale(xScale);
// Plotting Score 1 for now
const y = (d) => d["Score 1"];
const yScale = d3.scaleLinear()
.domain([0, d3.max(data, y)])
.range([height, 0]);
const yMap = (d) => yScale(y(d))
const yAxis = d3.axisLeft().scale(yScale);
const svg = d3.select('body')
.append('svg')
.attr('width', width)
.attr('height', height)
.append('g')
.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
svg.append('g')
.attr('class', 'axis axis--x')
.call(xAxis)
.attr('transform', 'translate(0, 800)')
.append('text')
.attr('class', 'label')
.attr('x', width)
.attr('y', -6)
.style('text-anchor', 'middle')
.text('Category');
svg.append('g')
.attr('class', 'axis axis--y')
.call(yAxis)
.attr('transform', 'rotate(-90)')
.attr('y', 0 - margin.left)
.attr('x', 0 - (height/2))
.attr("dy", "1em")
.style('text-anchor', 'middle')
.text('Score');
svg.selectAll('circle')
.data(data)
.enter()
.append('circle')
.attr('class', 'dot')
.attr('cx', xMap)
.attr('cy', yMap)
.attr('r', 3.5)
.attr('fill', 'red');
});
A few lines of data.csv are given:
Name,Category,Score 1,Score 2,Score 3,Average score
A1_P1,A01,2.3,2.4,4.1,2.4
A2_P1,A02,1.4,1.5,2.4,1.5
A3_P1,A03,0.9,0.9,0.9,0.9
A4_P1,B01,1.5,1.5,1,1.5
A5_P1,B02,1.2,1.2,1.4,1.2
A6_P1,B03,1,1,1.1,1
A7_P1,C01,1.6,1.2,1,1.2
A8_P1,C02,1.2,1.2,0.9,1.2
A9_P1,C03,1.1,1.1,1,1.1
A10_P1,D01,1.5,1.6,1.1,1.5
The x-axis is showing (but not the 'Category' label), and even more importantly, the y-axis is not showing at all. The points themselves are being shown correctly, though. Does anyone know what is wrong with my y-axis setting and axis labels? Thanks in advance!

When I start a new chart with d3, I find it best to start with a known simple set-up example to place my drawing g, axis, etc... This is my usual starting point.
That said, here's list of issues I see in your chart:
Not placing x-axis dynamically.
svg container is sized wrong and ends up on top of axis.
Attempting to append a text axis label to y axis but you never actually append the text (and then apply attributes and styling to the axis itself instead of that missing text element).
Cleaning this all up looks like this:
<!DOCTYPE html>
<html>
<head>
<script data-require="d3#4.0.0" data-semver="4.0.0" src="https://d3js.org/d3.v4.min.js"></script>
</head>
<body>
<script>
const margin = {
top: 100,
right: 50,
left: 50,
bottom: 50
};
const width = 500 - margin.right - margin.left;
const height = 500 - margin.top - margin.bottom;
//d3.csv("data.csv", (error, data) => {
// if (error) throw error;
var data = [{"Name":"A1_P1","Category":"A01","Score 1":"2.3","Score 2":"2.4","Score 3":"4.1","Average score":"2.4"},{"Name":"A2_P1","Category":"A02","Score 1":"1.4","Score 2":"1.5","Score 3":"2.4","Average score":"1.5"},{"Name":"A3_P1","Category":"A03","Score 1":"0.9","Score 2":"0.9","Score 3":"0.9","Average score":"0.9"},{"Name":"A4_P1","Category":"B01","Score 1":"1.5","Score 2":"1.5","Score 3":"1","Average score":"1.5"},{"Name":"A5_P1","Category":"B02","Score 1":"1.2","Score 2":"1.2","Score 3":"1.4","Average score":"1.2"},{"Name":"A6_P1","Category":"B03","Score 1":"1","Score 2":"1","Score 3":"1.1","Average score":"1"},{"Name":"A7_P1","Category":"C01","Score 1":"1.6","Score 2":"1.2","Score 3":"1","Average score":"1.2"},{"Name":"A8_P1","Category":"C02","Score 1":"1.2","Score 2":"1.2","Score 3":"0.9","Average score":"1.2"},{"Name":"A9_P1","Category":"C03","Score 1":"1.1","Score 2":"1.1","Score 3":"1","Average score":"1.1"},{"Name":"A10_P1","Category":"D01","Score 1":"1.5","Score 2":"1.6","Score 3":"1.1","Average score":"1.5"}];
const x = (d) => d["Category"];
const xScale = d3.scalePoint()
.domain(data.map((d) => d["Category"]))
.range([0, width]);
const xMap = (d) => xScale(x(d));
const xAxis = d3.axisBottom().scale(xScale);
// Plotting Score 1 for now
const y = (d) => d["Score 1"];
const yScale = d3.scaleLinear()
.domain([0, d3.max(data, y)])
.range([height, 0]);
const yMap = (d) => yScale(y(d))
const yAxis = d3.axisLeft().scale(yScale);
const svg = d3.select('body')
.append('svg')
.attr('width', width + margin.right + margin.left)
.attr('height', height + margin.top + margin.bottom)
.append('g')
.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
svg.append('g')
.attr('class', 'axis axis--x')
.call(xAxis)
.attr('transform', 'translate(0,' + height + ')')
.append('text')
.attr('class', 'label')
.attr('x', width)
.attr('y', -6)
.style('text-anchor', 'middle')
.text('Category');
svg.append('g')
.attr('class', 'axis axis--y')
.call(yAxis)
.append("text")
.attr('transform', 'rotate(-90)')
.attr('y', 0 - margin.left)
.attr('x', 0 - (height / 2))
.attr("dy", "1em")
.style('text-anchor', 'middle')
.text('Score')
.style('fill', 'black')
svg.selectAll('circle')
.data(data)
.enter()
.append('circle')
.attr('class', 'dot')
.attr('cx', xMap)
.attr('cy', yMap)
.attr('r', 3.5)
.attr('fill', 'red');
//});
</script>
</body>
</html>

How to add a line graph to a scatterplot using d3?

I currently have a working scatter plot that I make using this
var data = (an array of arrays with two integers in each array)
var margin = {top: 20, right: 15, bottom: 60, left: 60}
, width = 300 - margin.left - margin.right
, height = 250 - margin.top - margin.bottom;
var x = d3.scale.linear()
.domain([0, d3.max(data, function(d) { return d[0]; })])
.range([ 0, width ]);
var y = d3.scale.linear()
.domain([0, d3.max(data, function(d) { return d[1]; })])
.range([ height, 0 ]);
var chart = d3.select('.scatterGraph')
.append('svg:svg')
.attr('width', width + margin.right + margin.left)
.attr('height', height + margin.top + margin.bottom)
.attr('class', 'chart')
var main = chart.append('g')
.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')')
.attr('width', width)
.attr('height', height)
.attr('class', 'main')
// draw the x axis
var xAxis = d3.svg.axis()
.scale(x)
.orient('bottom')
.ticks(5);
main.append('g')
.attr('transform', 'translate(0,' + height + ')')
.attr('class', 'main axis date')
.call(xAxis);
// draw the y axis
var yAxis = d3.svg.axis()
.scale(y)
.orient('left');
main.append('g')
.attr('transform', 'translate(0,0)')
.attr('class', 'main axis date')
.call(yAxis);
var g = main.append("svg:g");
g.selectAll("scatter-dots")
.data(data)
.enter().append("svg:circle")
.attr("cx", function (d,i) { return x(d[0]); } )
.attr("cy", function (d) { return y(d[1]); } )
.attr("r", 2);
I was wondering how I could add a line graph (or alternatively another scatter plot) to this graph. I'm very new to d3 so I'm currently lost on how to do it. For example I would just want to add a line described by a function y = 2t where t is the x axis of the scatterplot. Thanks!

If it is as simple as a line described by a function y=2t you can just append a line element to your chart in this case main like this, assuming that your width is at least greater than twice your height
main.append("line").attr("x1", 0).attr("x2", height/2)
.attr("y1", height).attr("y2", 0);
But if you have a line that connected through multiple points, you will need to add a path element to your svg, and use d3.svg.line() function to generate its d attribute. So something like this,
var lineFunction = d3.svg.line().x(function (d) { x(d[0])}; )
.y(function (d) { y(d[1])}; );
var gLine = main.append("g");
gLine.append("path").attr("d", lineFunction(data));
For another scatter plot, you can reuse
var g = main.append("svg:g");
g.selectAll("scatter-dots")
.data(data2)
.enter().append("svg:circle")
.attr("cx", function (d,i) { return x(d[0]); } )
.attr("cy", function (d) { return y(d[1]); } )
.attr("r", 2);
but with a different set of data, and different accessor functions or scales if needed.

Categories