OXIESEC PANEL

Name	Size	Modified	Perms
📁 ..	-	12/31/2022 06:53:36 AM	rwxr-xr-x
📄 SVGAll.js	43.74 KB	08/14/2022 11:05:25 AM	rw-r--r--
📄 app2.css	6.71 KB	08/14/2022 11:05:26 AM	rw-r--r--
📄 appanimate.js	7.62 KB	08/14/2022 11:05:25 AM	rw-r--r--
📄 appcharts.js	33.33 KB	08/14/2022 11:05:25 AM	rw-r--r--
📄 appcontroller.js	20.15 KB	08/14/2022 11:05:25 AM	rw-r--r--
📄 appmodel.js	1.41 KB	08/14/2022 11:05:26 AM	rw-r--r--
📄 arundata2.js	1.33 KB	08/14/2022 11:05:26 AM	rw-r--r--
📄 charts_svg.js	622 bytes	08/14/2022 11:05:26 AM	rw-r--r--
📄 d3.v2.js	234.06 KB	08/14/2022 11:05:26 AM	rw-r--r--
📄 d3.v3.js	253.25 KB	08/14/2022 11:05:25 AM	rw-r--r--
📄 spec.js	3.77 KB	08/14/2022 11:05:25 AM	rw-r--r--

Editing: appcharts.js

//.attr("x", function(d) { return xs(eval(chart.xcol))+xs.rangeBand()/2.33; })
//
function myStackBarChart(chartobj, page, parentsvg, mycolor){
	var axes = page.axes;
	var axespos = page.axespos;
	var chart = chartobj.spec;
	var data = chartobj.spec.data;
	var x = axespos[chart.xscale.name];
	var y = axespos[chart.yscale.name];
	var xs = axes[x].Scale;
	var ys = axes[y].Scale;
	//var color=["#3366cc", "#dc3912", "#ff9900", "#109618", "#990099", "#0099c6", "#dd4477","#66aa00", "#b82e2e", "#cccccc", "#0011cc", "#316395", "#994499", "#22aa99", "#aaaa11", "#6633cc", "#e67300", "#8b0707", "#651067", "#329262"] ;

if(typeof chart.ycol2 != 'undefined'){
		g.append("g")
			.attr("transform", "translate(" + (chart.layout.left + 20) + "," + chart.layout.top + ")")
			.selectAll(".b" + chart.gclass)
			.data(data)
			.enter().append("rect")
			.attr("clip-path", "url(#clip" + chart.num + ")")
			.attr("class", "b"+chart.gclass)
	                .attr("type", chart.type)
			.attr("x", function(d) { return xs(eval(chart.xcol))+xs.rangeBand()/2.33; })
			.attr("y", function(d) { return ys(eval(chart.ycol2)); })
			.attr("width", function(d) { return 15;})
			.attr("height", function(d) { return eval(chart.layout.height) - ys(eval(chart.ycol2)); })
			.style("fill", appcolors(i))
			.style("stroke", appcolors(i++));
	}

if(typeof chart.ycol3 != 'undefined'){
		g.append("g")
			.attr("transform", "translate(" + (chart.layout.left + 40) + "," + chart.layout.top + ")")
			.selectAll(".c" + chart.gclass)
			.data(data)
			.enter().append("rect")
			.attr("clip-path", "url(#clip" + chart.num + ")")
			.attr("class", "c"+chart.gclass)
			.attr("type", chart.type)
			.attr("x", function(d) { return xs(eval(chart.xcol))+xs.rangeBand()/2.33; })
			.attr("y", function(d) { return ys(eval(chart.ycol3)); })
			.attr("width", function(d) { return 18;})
			.attr("height", function(d) { return eval(chart.layout.height) - ys(eval(chart.ycol3)); })
			.style("fill", appcolors(i))
			.style("stroke", appcolors(i++));
	}

return g;
}

function myBubbleChart(chartobj,page,parentsvg,mycolor){
	var axes = page.axes;
	var axespos = page.axespos;
	var chart = chartobj.spec;
	var data = chartobj.spec.data;
	var x = axespos[chart.xscale.name];
	var y = axespos[chart.yscale.name];
	var xs = axes[x].Scale;
	var ys = axes[y].Scale;

if((typeof chartobj.spec.cw != 'undefined')){
			if(chartobj.spec.cw == "auto"){
				graph.attr("r", 8);
			}
			else {
				graph.attr("r", function(d) { return eval(chartobj.spec.cw) });
			}
		} 
		else {
			graph.attr("r",  7);
		}
	return graph;
}

function myStackBarChart1(chartobj,page,parentsvg,mycolor){
	var axes = page.axes;
	var axespos = page.axespos;
	var chart = chartobj.spec;
	var data = chartobj.spec.data;
	var x = axespos[chart.xscale.name];
	var y = axespos[chart.yscale.name];
	var xs = axes[x].Scale;
	var ys = axes[y].Scale;

g.append("g")
		.attr("transform", "translate(" + chart.layout.left + "," + chart.layout.top + ")")
		.selectAll("." + chart.gclass)
		.data(data)
		.enter().append("rect")
		.attr("clip-path", "url(#clip" + chart.num + ")")
		.attr("class", chart.gclass)
		.attr("x", function(d) { return xs(eval(chart.xcol))+xs.rangeBand()/2; })
		.attr("y", function(d) { return ys(eval(chart.ycol2)); })
		.attr("width", function(d) { return 15;})
		.attr("height", function(d) { return eval(chart.layout.height) - ys(eval(chart.ycol2)); })
		.style("fill", "GoldenRod")
		.style("stroke", "Black");

/*var st3 = parentsvg.append("g")
	  .attr("transform", "translate(" + chart.layout.left + "," + chart.layout.top + ")")
	  .selectAll("." + chart.gclass)
	  .data(data)
	  .enter().append("rect")
	  .attr("clip-path", "url(#clip" + chart.num + ")")
	  .attr("class", chart.gclass)
	  .attr("x", function(d) { return xs(eval(chart.xcol)); })
	  .attr("y", function(d) { return ys(eval(chart.ycol3)); })
	  .attr("width", function(d) { return 15;})
	  .attr("height", function(d) { return eval(chart.layout.height) - ys(eval(chart.ycol3)); })
	  .style("fill", "Maroon")
	  .style("stroke", "Black");
	  */

return g;
}

function myTubeChart(chartobj,page,parentsvg,mycolor){
	var axes = page.axes;
	var axespos = page.axespos;
	var chart = chartobj.spec;
	var data = chartobj.spec.data;
	var color = d3.scale.category20c();
	var x = axespos[chart.xscale.name];
	var y = axespos[chart.yscale.name];
	var xs = axes[x].Scale;
	var ys = axes[y].Scale;
	var g = parentsvg.append("g").attr("transform", "translate(" + chart.layout.left + "," + chart.layout.top + ")").attr("fmt", chart.fmt);

g.selectAll(".tubebar")
		.data(data)
		.enter().append("rect")
		.attr("class", "tubebar")
		.attr("type", chart.type)
		.attr("fill", mycolor)
		.attr("opacity", "0.2")
		.attr("x", 0)
		.attr("y", function(d) { return ys(eval(chart.ycol)); })
		.attr("width", function(d) { return chart.layout.width; })
		.attr("height", ys.rangeBand() - 2);

g.selectAll("." + chart.gclass)
		.data(data)
		.enter().append("rect")
		.attr("clip-path", "url(#clip" + chart.position + ")")
		.attr("class", chart.gclass)
		.attr("type", chart.type)
		.attr("fill", mycolor)
		.attr("opacity", "1")
		.attr("x", 0)
		.attr("y", function(d) { return ys(eval(chart.ycol)) + 4; })
		.attr("width", function(d) { return xs(eval(chart.xcol)); })
		.attr("height", ys.rangeBand() - 8);

g.selectAll("." + "ttxt")
		.data(data)
		.enter().append("text")
		.attr("class", "ttxt")
		.attr("class", "whitetext")
		.attr("type", chart.type)
		.attr("dx", function(d) { return xs(eval(chart.xcol)) -25; })
		.attr("dy", function(d) { return ys(eval(chart.ycol)) + ys.rangeBand()/2 + 4; })
		.text(function(d,i) { return eval(chart.xcol); });

return g;
}

function myColumnChart(chartobj,page,parentsvg,mycolor){
	var axes = page.axes;
	var axespos = page.axespos;
	var chart = chartobj.spec;
	var data = chartobj.spec.data;
	var color = d3.scale.category20c();
	var x = axespos[chart.xscale.name];
	var y = axespos[chart.yscale.name];
	var xs = axes[x].Scale;
	var ys = axes[y].Scale;
	var g = parentsvg.append("g");

g.attr("transform", "translate(" + chart.layout.left + "," + chart.layout.top + ")")
		.attr("fmt", chart.fmt)
		.selectAll("rect")
		.data(data)
		.enter().append("rect")
		.attr("clip-path", "url(#clip" + chart.position + ")")
		.attr("class", chart.gclass)
		.attr("type", chart.type)
		.attr("fill", mycolor)
		.attr("x", 0)
		.attr("y", function(d) { return ys(eval(chart.ycol)); })
		.attr("width", function(d) { return xs(eval(chart.xcol)); })
		.attr("height", ys.rangeBand() - 2);

return g;
}

function myStepChart(chartobj,page,parentsvg,mycolor){
	var axes = page.axes;
	var axespos = page.axespos;
	var chart = chartobj.spec;
	var data = chartobj.spec.data;
	var x = axespos[chart.xscale.name];
	var y = axespos[chart.yscale.name];
	var xs = axes[x].Scale;
	var ys = axes[y].Scale;

if((typeof chartobj.spec.cw != 'undefined')){
		if(chartobj.spec.cw == "auto"){
			bar.attr("width", xs.rangeBand() - 8);
		}
		else {
			bar.attr("width", chartobj.spec.cw)
				.attr("x", function(d) { return xs(eval(chart.xcol))+xs.rangeBand()/2 - (chartobj.spec.cw/2); });
		}
	}

return bar;

}

function myTestBarChart(chartobj,page,parentsvg,mycolor){
	var axes = page.axes;
	var axespos = page.axespos;
	var chart = chartobj.spec;
	var data = chartobj.spec.data;
	var x = axespos[chart.xscale.name];
	var y = axespos[chart.yscale.name];
	var xs = axes[x].Scale;
	var ys = axes[y].Scale;
	//var color=["#3366cc", "#dc3912", "#ff9900", "#109618", "#990099", "#0099c6", "#dd4477","#66aa00", "#b82e2e", "#cccccc", "#0011cc", "#316395", "#994499", "#22aa99", "#aaaa11", "#6633cc", "#e67300", "#8b0707", "#651067", "#329262"] ;

var shadow = parentsvg.append("defs").append("filter")
		.attr("id","dropshadow")
		.attr("height","130%");

shadow.append("feGaussianBlur")
		.attr("in","SourceAlpha")
		.attr("stdDeviation","3");

shadow.append("feOffset")
		.attr("dx","2")
		.attr("dy","2")
		.attr("result","offsetblur");

return bar;

}
function myBarChart(chartobj,page,parentsvg,mycolor){
	var axes = page.axes;
	var axespos = page.axespos;
	var chart = chartobj.spec;
	var data = chartobj.spec.data;
	var x = axespos[chart.xscale.name];
	var y = axespos[chart.yscale.name];
	var xs = axes[x].Scale;
	var ys = axes[y].Scale;

return bar;

}

function myPillarChart(chartobj,page,parentsvg,mycolor){
	var axes = page.axes;
	var axespos = page.axespos;
	var chart = chartobj.spec;
	var data = chartobj.spec.data;
	var x = axespos[chart.xscale.name];
	var y = axespos[chart.yscale.name];
	var xs = axes[x].Scale;
	var ys = axes[y].Scale;
	//var color=["#3366cc", "#dc3912", "#ff9900", "#109618", "#990099", "#0099c6", "#dd4477","#66aa00", "#b82e2e", "#cccccc", "#0011cc", "#316395", "#994499", "#22aa99", "#aaaa11", "#6633cc", "#e67300", "#8b0707", "#651067", "#329262"] ;

bar.transition()
		.ease("linear")
		.duration(500)
		.attr("height", function(d) { return eval(chart.layout.height) - ys(eval(chart.ycol)); });

parentsvg.selectAll("." + "ttxt")
		.data(data)
		.enter().append("text")
		.attr("class", "ttxt")
		.attr("class", "whitetext")
		.attr("type", chart.type)
		.attr("dx", function(d) { return xs(eval(chart.xcol))+xs.rangeBand()-barwidth/3 ; })
		.attr("dy", function(d) { return ys(eval(chart.ycol))+50; })
		.text(function(d,i) { return parseInt(eval(chart.ycol)); });
	return bar;

}

function drawDataXGridLine(chartobj,page,parentsvg,mycolor){
	var axes = page.axes;
	var axespos = page.axespos;
	var chart = chartobj.spec;
	var data = chartobj.spec.data;
	var x = axespos[chart.xscale.name];
	var y = axespos[chart.yscale.name];
	var xs = axes[x].Scale;
	var ys = axes[y].Scale;

delete arr;

return xgrid;
}

function drawDataYGridLine(chartobj,page,parentsvg,mycolor){
	var axes = page.axes;
	var axespos = page.axespos;
	var chart = chartobj.spec;
	var data = chartobj.spec.data;
	var x = axespos[chart.xscale.name];
	var y = axespos[chart.yscale.name];
	var xs = axes[x].Scale;
	var ys = axes[y].Scale;

delete arr;

return ygrid;
}

function drawXGridLine(chartobj,parentsvg,ngridlines){
	var chart = chartobj.spec;
	var data = chartobj.spec.data;

var n = ngridlines;
	var gridgap = chart.layout.width/ n; 
	var arr = new Array(n);

delete arr;

return xgrid;
}

function drawYGridLine(chartobj,parentsvg,ngridlines){
	var chart = chartobj.spec;
	var data = chartobj.spec.data;

var n = ngridlines;
	var gridgap = chart.layout.height/ n; 
	var arr = new Array(n);

delete arr;

return ygrid;
}

function myAreaChart(chartobj,page,parentsvg, mycolor){
	var axes = page.axes;
	var axespos = page.axespos;
	var chart = chartobj.spec;
	var data = chartobj.spec.data;
	var x = axespos[chart.xscale.name];
	var y = axespos[chart.yscale.name];
	var xs = axes[x].Scale;
	var ys = axes[y].Scale;

var gph = d3.svg.area().interpolate("monotone")
		.x(function(d) { return xs(eval(chart.xcol)); })
		.y0(chart.layout.height)
		.y1(function(d) { return ys(eval(chart.ycol)); });

chartobj.path = gph;

var g = parentsvg.append("g")
		.attr("transform", "translate(" + chart.layout.left + "," + chart.layout.top + ")")
		.attr("class", chart.gclass)
		.attr("type", chart.type)
		.attr("fmt", chart.fmt);
	
	var line=g.append("path")
		  .datum(data)
	  	  .attr("clip-path", "url(#clip" + chart.position + ")")
	  	  .attr("xcol", chart.xcol)
	  	  .attr("ycol", chart.ycol)
	  	  .attr("d", gph)
	  	  .attr("stroke", mycolor)
	  	  .attr("fill", mycolor)
	  	  .attr("class",chart.gclass);

var stroke = g.style("stroke");
        if(stroke == "none"){
     	               stroke = mycolor;
        }

return circle;

}

function myBrushAreaChart(chartobj,page,parentsvg, mycolor){
	var axes = page.axes;
	var axespos = page.axespos;
	var chart = chartobj.spec;
	var data = chartobj.spec.data;
	var x = axespos[chart.xscale.name];
	var y = axespos[chart.yscale.name];
	var xs = axes[x].Scale;
	var ys = axes[y].Scale;

var gph = d3.svg.area().interpolate("monotone")
		.x(function(d) { return xs(eval(chart.xcol)); })
		.y0(chart.layout.height)
		.y1(function(d) { return ys(eval(chart.ycol)); });

chartobj.path = gph;

return parentsvg.append("g")
		.attr("transform", "translate(" + chart.layout.left + "," + chart.layout.top + ")")
		.attr("class", chart.gclass)
		.append("path")
		.datum(data)
		.attr("clip-path", "url(#clip" + chart.position + ")")
		.attr("xcol", chart.xcol)
		.attr("ycol", chart.ycol)
		.attr("d", gph)
		.attr("fill", mycolor)
		.attr("class",chart.gclass);
}

function myLineChart(chartobj,page,parentsvg,mycolor){
	var chart = chartobj.spec;
	var data = chartobj.spec.data;
	var axes = page.axes;
	var axespos = page.axespos;
	var x = axespos[chart.xscale.name];
	var y = axespos[chart.yscale.name];
	var xs = axes[x].Scale;
	var ys = axes[y].Scale;

var gph = d3.svg.line().interpolate("monotone")
		.x(function(d) { return xs(eval(chart.xcol))+xs.rangeBand()/2; })
		.y(function(d) { return ys(eval(chart.ycol)); });

chartobj.path = gph;

console.log("Now Drawing LINE ..." + data);
	var g = parentsvg .append("g") .attr("transform", "translate(" + (chart.layout.left) + "," + chart.layout.top + ")")
		.attr("chartno", chart.chartno)
		.attr("callback", chart.callback)
		.attr("fmt", chart.fmt)
		.attr("type", chart.type);

var line = g.attr("class", chart.gclass).append("path")
		.datum(data)
		.attr("clip-path", "url(#clip" + chart.position + ")")
		.attr("xcol", chart.xcol)
		.attr("ycol", chart.ycol)
		.attr("d", gph)
		.attr("class", chart.gclass)
		.attr("prevclass", chart.gclass)
		.attr("type", chart.type)
		.attr("stroke", mycolor)
		//.attr("filter", "url(#rx3dfilter)")
		//.attr("filter", "url(#rxdropshadow)")
		.attr("fill", "none");

var stroke = g.style("stroke");
	if(stroke == "none"){
		stroke = mycolor;
	}

return circle;
}

function myBulletChart(chartobj,page,parentsvg,mycolor){
	var axes = page.axes;
	var axespos = page.axespos;
	var chart = chartobj.spec;
	var data = chartobj.spec.data;
	var x = axespos[chart.xscale.name];
	var y = axespos[chart.yscale.name];
	var xs = axes[x].Scale;
	var ys = axes[y].Scale;

if((typeof chartobj.spec.cw != 'undefined')){
		if(chartobj.spec.cw == "auto"){
			bar.attr("width", xs.rangeBand() - 8);
		}
		else {
			bar.attr("width", chartobj.spec.cw);
		}
	}

return bar;
}

function myCustomPieChart(chartobj,page,parentsvg,mycolor){
	var axes = page.axes;
	var axespos = page.axespos;
	var data = chartobj.spec.data;

var color=["#3366cc", "#dc3912", "#ff9900", "#109618", "#990099", "#0099c6", "#dd4477","#66aa00", "#b82e2e", "#cccccc", "#0011cc", "#316395", "#994499", "#22aa99", "#aaaa11", "#6633cc", "#e67300", "#8b0707", "#651067", "#329262"] ;
	var chart = chartobj.spec;
	// data = getPieData();
	/*  var x = axespos[chart.xscale.name];
	    var y = axespos[chart.yscale.name];
	    var xs = axes[x].Scale;
	    var ys = axes[y].Scale;
	    */

if(typeof chart.color != 'undefined'){
		color = chart.color;
	}
	if(typeof chart.inr == 'undefined'){
		chart.inr = 0;
	}
	if(typeof chart.outr == 'undefined'){
		var r = chart.layout.width < chart.layout.height ? chart.layout.width : chart.layout.height;
		chart.outr = r/2;
	}

var vis = parentsvg .append("svg:g") .attr("test", "vjpiechart") .data([data])  .append("svg:g") .attr("transform", "translate(" + (chart.outr+chart.layout.left) + "," + (chart.outr+chart.layout.top) + ")")

var arc = d3.svg.arc() .innerRadius(chart.inr).outerRadius(chart.outr);

var pie = d3.layout.pie() .value(function(d) { return eval(chart.ycol); });

var arcs = vis.selectAll("g.slice") .data(pie) .enter() .append("svg:g") .attr("class", "slice");

arcs.append("svg:path") .attr("fill", function(d, i) { return color[i]; } ) .attr("d", arc);

if((typeof chart.label == 'undefined')){
		var t = arcs.append("svg:text")
			.attr("transform", function(d) { var r=1.1*chart.outr; var c = arc.centroid(d), x = c[0], y = c[1], h = Math.sqrt(x*x + y*y); return "translate(" + (x/h * r) +  ',' + (y/h * r) +  ")"; })
			//.attr("transform", function(d) {    d.innerRadius = chart.inr; d.outerRadius =chart.outr; return "translate(" + arc.centroid(d)  + ")";    })
			.attr("text-anchor", "middle")
			.attr("font", "8px")
			.text(function(d, i) { return data[i][0]; });

var t = vis.append("svg:text")
			.attr("transform", function(d) { return "translate(" +  arc.centroid(d) + ")"})
			.attr("text-anchor", "middle")
			.text(function(d, i) { return chart.title; });
	}

return vis;
}

function myPieChart(chartobj,page,parentsvg,mycolor){
	var axes = page.axes;
	var axespos = page.axespos;
	var data = chartobj.spec.data;

var chart = chartobj.spec;
	var x = page.axespos[chart.xscale.name];
	var y = page.axespos[chart.yscale.name];

// data = getPieData();
	/*  var x = axespos[chart.xscale.name];
	    var y = axespos[chart.yscale.name];
	    var xs = axes[x].Scale;
	    var ys = axes[y].Scale;
	    */

var arc = d3.svg.arc() .innerRadius(chart.inr).outerRadius(chart.outr);

var pie = d3.layout.pie() .value(function(d) { return eval(chart.ycol); });

arcs.append("svg:path") .attr("fill", function(d, i) { return appcolors(i); } ) .style("stroke", function(d, i){ return appcolors[i]; }) .attr("d", arc);

return arcs;
}

function myCustomChart(chartobj,page,parentsvg,mycolor){
	var chart = chartobj.spec;
	var data = chartobj.spec.data;
	var axes = page.axes;
	var axespos = page.axespos;
	var x = axespos[chart.xscale.name];
	var y = axespos[chart.yscale.name];
	var xs = axes[x].Scale;
	var ys = axes[y].Scale;
	chart.position = "099";

var gph = d3.svg.line().interpolate("monotone")
		.x(function(d) { return xs(eval(chart.xcol)) + xs.rangeBand()/2; })
		.y(function(d) { return ys(eval(chart.ycol)) + 30; });

chartobj.path = gph;

console.log("Now Drawing LINE ..." + data);
	var g = parentsvg .append("g") .attr("transform", "translate(" + (chart.layout.left) + "," + chart.layout.top + ")");

g.selectAll("." + "ttxt")
		.data(data)
		.enter().append("text")
		.attr("class", "ttxt")
		.attr("class", function(d,i) { return i%3 ? "txtgreen" : "txtred"})
		.attr("dx", function(d) { return xs(eval(chart.xcol))+xs.rangeBand()/2; })
		.attr("dy", function(d) { return +4+ys(eval(chart.ycol)); })
		.text(function(d,i) { return "(" + Math.floor((ys(eval(chart.ycol))/3)) + "%)"; });

g.selectAll("." + "xttxt")
		.data(data)
		.enter().append("svg:image")
		.attr('id', 'tile-ww')
		.attr('patternUnits', 'userSpaceOnUse')
		.attr('xlink:href', function(d,i) { return i%3 ? '/up.png' : '/down.png'})
		.attr("class", "xttxt")
		.attr("x", function(d) { return xs(eval(chart.xcol))+xs.rangeBand()/2; })
		.attr("y", function(d) { return +4+ys(eval(chart.ycol)); })
		.attr('width', 16)
		.attr('height', 16);

return  g;
}
function myDiffChart(chartobj,page,parentsvg,mycolor){
	var chart = chartobj.spec;
	var data = chartobj.spec.data;
	var axes = page.axes;
	var axespos = page.axespos;
	var x = axespos[chart.xscale.name];
	var y = axespos[chart.yscale.name];
	var xs = axes[x].Scale;
	var ys = axes[y].Scale;
	chart.position = "099";

var gph = d3.svg.line().interpolate("monotone")
		.x(function(d) { return xs(eval(chart.xcol)) + xs.rangeBand()/2; })
		.y(function(d) { return ys(eval(chart.ycol)) + 30; });

chartobj.path = gph;

console.log("Now Drawing LINE ..." + data);
	var g = parentsvg .append("g") .attr("transform", "translate(" + (chart.layout.left) + "," + chart.layout.top + ")");

g.selectAll("." + "ttxt")
		.data(data)
		.enter().append("text")
		.attr("class", "ttxt")
		.attr("class", function(d,i) { return i%3 ? "txtgreen" : "txtred"})
		.attr("dx", function(d) { return xs(eval(chart.xcol))+xs.rangeBand()/2; })
		.attr("dy", function(d) { return -40+ys(eval(chart.ycol)); })
		.text(function(d,i) { return "" + eval(chart.text) + "%"; });
	//.text(function(d,i) { return "(" + Math.floor((ys(eval(chart.ycol))/3)) + "%)"; });

g.selectAll("." + "xttxt")
		.data(data)
		.enter().append("svg:image")
		.attr('id', 'tile-ww')
		.attr('patternUnits', 'userSpaceOnUse')
		.attr('xlink:href', function(d,i) { return (eval(chart.text) > 0) ? '/up.png' : '/down.png'})
		.attr("class", "xttxt")
		.attr("x", function(d) { return xs(eval(chart.xcol))+xs.rangeBand()/2; })
		.attr("y", function(d) { return -37+ys(eval(chart.ycol)); })
		.attr('width', 16)
		.attr('height', 16);

return  g;
}

/*function toolTip(chobj){
	obj = chobj.chart;
	var ctop = chobj.spec.layout.top;
	var cheight = chobj.spec.layout.height;
	var cwidth = chobj.spec.layout.width;

obj.on("mouseover", function(d,i){
			var a = d3.select(this.parentNode);
			var b = a.select("#val");
			b.remove();

var pos = d3.mouse(this);
			var grp = a.append("g").attr("id", "val");
			var  xpos=pos[0], ypos=pos[1];

if((cheight - ypos) < 100){
			ypos = ypos - 100;
			}

if((cwidth - xpos) < 200){
			xpos = xpos - 200;
			}

var xtitle = chobj.spec.xscale.title;
			var ytitle = chobj.spec.yscale.title;

var xt_text = d[0], yt_text;
			if(ytitle == "Hits"){
				yt_text = d[1];
			}
			else{
				yt_text = d[2];
			}

var t1 = grp.append("svg:text")
				.attr("id", "val")
				.text(xtitle + " : " + xt_text)
				.attr("x", xpos+30)
				.attr("y", ypos+15)
				.style("stroke", "steelblue")
				.style("stroke-width", 0.6)
				.style("font-size", "95%");

var t2 = grp.append("svg:text")
				.attr("id", "val")
				.text(ytitle + " : " + yt_text)
				.attr("x", xpos+30)
				.attr("y", ypos+25)
				.style("stroke", "steelblue")
				.style("stroke-width", 0.6)
				.style("font-size", "95%");

var er = new eventResponse();
			er.chart = obj;
			er.chartno = d3.select(this.parentNode).attr("chartno");
			er.data = d;
			er.dataindex = i;
			er.eventname = this.event;
	})
	.on("mouseout", function(d,i) {
			d3.select(this).transition().duration(100)
			var a = d3.select(this.parentNode);
			var b = a.select("#val");
			b.transition().duration(1000).remove();
			});

}*/