diff --git a/app.js b/app.js index 2b8ba40..dcd80a2 100644 --- a/app.js +++ b/app.js @@ -15,52 +15,3 @@ d3.select('svg').selectAll('path') .append('path') .attr('fill', '#099') .attr('d', dAttributeFunction); - -const dragBehavior = d3.drag() - .on('start', (event) => { - d3.select('table tr:nth-child(2) td:first-child') - .html(worldProjection.invert([event.x, event.y])[0]) - d3.select('table tr:nth-child(2) td:last-child') - .html(worldProjection.invert([event.x, event.y])[1]) - - d3.selectAll('rect').remove(); - d3.select('svg').append('rect') - .attr('x', event.x) - .attr('y', event.y); - }) - .on('drag', (event) => { - d3.select('table tr:nth-child(3) td:first-child') - .html(worldProjection.invert([event.x, event.y])[0]) - d3.select('table tr:nth-child(3) td:last-child') - .html(worldProjection.invert([event.x, event.y])[1]) - - d3.select('rect').attr('width', event.x-d3.select('rect').attr('x')) - d3.select('rect').attr('height', event.y-d3.select('rect').attr('y')) - }) - -d3.select('svg').call(dragBehavior); - -d3.select('form').on('submit', (event) => { - event.preventDefault(); - - d3.selectAll('rect').remove(); - - const lat1 = d3.select('input:first-child').property('value'); - const lng1 = d3.select('input:nth-child(2)').property('value'); - const location1 = worldProjection([lat1, lng1]); - const x1 = location1[0]; - const y1 = location1[1]; - - const lat2 = d3.select('input:nth-child(4)').property('value'); - const lng2 = d3.select('input:nth-child(5)').property('value'); - const location2 = worldProjection([lat2, lng2]); - const x2 = location2[0]; - const y2 = location2[1]; - - d3.select('svg').append('rect') - .attr('fill', '#000') - .attr('x', x1) - .attr('y', y1) - .attr('width', x2-x1) - .attr('height', y2-y1) -}); diff --git a/index.html b/index.html index 2eacd24..9070841 100644 --- a/index.html +++ b/index.html @@ -8,31 +8,6 @@
- -| lat | -lng | -
|---|---|
| - | - |
| - | - |