<commit_before>var svgm;
// stores all active intermediate objects
var marks=[];
// intermediate link between the data, d3, and its dropzones
var markcount=0;
var dataset = [ 5, 10, 15, 20, 25 ];
var zonewidth=50;
var n;
var data=[];
function Mark()
{
	this.markId = 0;
	this.oldData = [];
	this.orientation = 'height';
}
function dataObjectsToColumn(objectarray,colname)
{
	var column=[];
	for(var i in objectarray)
	{
		column.push(objectarray[i][colname]);
	}
	return column;
}

function height(marknum, datacolumn, hover) {
	var vis	= $('#vis');
	var delegate = $("#delegate" + marknum);
	var x = delegate.offset().left - vis.offset().left;
	var y = delegate.offset().top - vis.offset().top;

	extents = d3.extent(datacolumn);

	var yscale = d3.scale.linear()
		.domain(extents)
		.range([0, 100]);

	var xscale = d3.scale.linear()
		.domain([0, datacolumn.length])
		.range([x+75, 600])

	var marks = d3.select("svg#vis").selectAll(".mark"+marknum)
		.data(datacolumn)

	marks.enter()
		.append('rect')
		.attr("class", "mark"+marknum)

	marks.transition().duration(500)
		.attr('height', 0)
		.attr("width", 20)
		.attr("x", function(d,i){ return xscale(i); })
		.attr("y", y+100)
		.attr("fill", "steelblue")
		.attr("x", function(d,i){ return xscale(i); })
		.attr('y', function(d, i) { return y+100-yscale(d)})
		.attr("height",function(d,i){return yscale(d);})
		.attr('opacity', function(d, i) { return hover ? 0.6 : 1 })
}

function width(marknum, datacolumn, hover) {
	var vis	= $('#vis');
	var delegate = $("#delegate" + marknum);
	var x = delegate.offset().left - vis.offset().left;
	var y = delegate.offset().top - vis.offset().top;

	extents = d3.extent(datacolumn);
	console.log(y);
	var yscale = d3.scale.linear()
		.domain([0, datacolumn.length])
		.range([y-125, y+225]);

	var xscale = d3.scale.linear()
		.domain(extents)
		.range([x+75, 100])

	var marks = d3.select("svg#vis").selectAll(".mark"+marknum)
		.data(datacolumn)

	marks.enter()
		.append('rect')
		.attr("class", "mark"+marknum)

	marks.transition().duration(500)
		.attr('height', 15)
		.attr("width", 0)
		.attr("x", x+100)
		.attr("y", function(d, i) { return yscale(i)})
		.attr("fill", "steelblue")
		.attr('height', 15)
		// .attr("x", function(d,i){ return xscale(d); })
		.attr('y', function(d, i) { return yscale(i)})
		.attr("width",function(d,i){return xscale(d);})
		.attr('opacity', function(d, i) { return hover ? 0.6 : 1 })	
}


$(document).ready(function(){
		
	$.getJSON("./olympics.json",function(response){
		// use d3 loader instead?
		for (var attr in response) {
			data[attr] = response[attr];
		}<commit_msg>Fixed width calculation<commit_after>var svgm;
// stores all active intermediate objects
var marks=[];
// intermediate link between the data, d3, and its dropzones
var markcount=0;
var dataset = [ 5, 10, 15, 20, 25 ];
var zonewidth=50;
var n;
var data=[];
function Mark()
{
	this.markId = 0;
	this.oldData = [];
	this.orientation = 'height';
}
function dataObjectsToColumn(objectarray,colname)
{
	var column=[];
	for(var i in objectarray)
	{
		column.push(objectarray[i][colname]);
	}
	return column;
}

function height(marknum, datacolumn, hover) {
	var vis	= $('#vis');
	var delegate = $("#delegate" + marknum);
	var x = delegate.offset().left - vis.offset().left;
	var y = delegate.offset().top - vis.offset().top;

	extents = d3.extent(datacolumn);

	var yscale = d3.scale.linear()
		.domain(extents)
		.range([0, 100]);

	var xscale = d3.scale.linear()
		.domain([0, datacolumn.length])
		.range([x+75, 600])

	var marks = d3.select("svg#vis").selectAll(".mark"+marknum)
		.data(datacolumn)

	marks.enter()
		.append('rect')
		.attr("class", "mark"+marknum)

	marks.transition().duration(500)
		.attr('height', 0)
		.attr("width", 20)
		.attr("x", function(d,i){ return xscale(i); })
		.attr("y", y+100)
		.attr("fill", "steelblue")
		.attr("x", function(d,i){ return xscale(i); })
		.attr('y', function(d, i) { return y+100-yscale(d)})
		.attr("height",function(d,i){return yscale(d);})
		.attr('opacity', function(d, i) { return hover ? 0.6 : 1 })
}

function width(marknum, datacolumn, hover) {
	var vis	= $('#vis');
	var delegate = $("#delegate" + marknum);
	var x = delegate.offset().left - vis.offset().left;
	var y = delegate.offset().top - vis.offset().top;

	extents = d3.extent(datacolumn);
	console.log(y);
	var yscale = d3.scale.linear()
		.domain([0, datacolumn.length])
		.range([y-125, y+225]);

	var xscale = d3.scale.linear()
		.domain(extents)
		.range([x+75, 100])

	var marks = d3.select("svg#vis").selectAll(".mark"+marknum)
		.data(datacolumn)

	marks.enter()
		.append('rect')
		.attr("class", "mark"+marknum)

	marks.transition().duration(500)
		.attr('height', 15)
		.attr("width", 0)
		.attr("x", x+100)
		.attr("y", function(d, i) { return yscale(i)})
		.attr("fill", "steelblue")
		.attr('height', 15)
		// .attr("x", function(d,i){ return xscale(d); })
		.attr('y', function(d, i) { return yscale(i)})
		.attr("width",function(d,i){return x+100-xscale(d);})
		.attr('opacity', function(d, i) { return hover ? 0.6 : 1 })	
}


$(document).ready(function(){
		
	$.getJSON("./olympics.json",function(response){
		// use d3 loader instead?
		for (var attr in response) {
			data[attr] = response[attr];
		}
{'fraction_non_alphanumeric': 0.21279025504377616, 'fraction_numerical': 0.02874000761324705, 'mean_word_length': 4.255, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5494522', 'n_tokens_mistral': 2213, 'n_tokens_neox': 1995, 'n_words': 430}