function drawLineChart(className,array_value,array_Kg, lineData_pre, lineData_ori){
// define dimensions of graph
var m = [80, 80, 80, 80]; // margins
var w = 500 - m[1] - m[3]; // width
var h = 300 - m[0] - m[2]; // height
// x & y range
var x = d3.scale.linear().domain([0, d3.max(array_Kg)]).range([0, w]);
var y = d3.scale.linear().domain([d3.min(array_value), d3.max(array_value)]).range([h, 0]);
var line = d3.svg.line()
// assign the X function to plot our line as we wish
.x(function(d) {
return x(d.x);
})
.y(function(d) {
return y(d.y);
});
var graph = d3.select("#"+className).append("svg:svg")
.attr("width", w + m[1] + m[3])
.attr("height", h + m[0] + m[2])
.append("svg:g")
.attr("transform", "translate(" + m[3] + "," + m[0] + ")");
// create yAxis
var xAxis = d3.svg.axis().scale(x).tickSize(-h).tickSubdivide(true).orient("bottom");
// Add the x-axis.
graph.append("svg:g")
.attr("class", "x axis")
.attr("transform", "translate(0," + h + ")")
.call(xAxis)
.append("svg:text")
.style("text-anchor","middle")
.text("Kg");
// create left yAxis
var yAxisLeft = d3.svg.axis().scale(y).ticks(4).orient("left");
// Add the y-axis to the left
graph.append("svg:g")
.attr("class", "y axis")
.attr("transform", "translate(-25,0)")
.call(yAxisLeft);
// Add the line by appending an svg:path element with the data line we created above
// do this AFTER the axes above so that the line is above the tick-lines
graph.append("svg:path").attr("d", line(lineData_pre)).attr("class","predict");
graph.append("svg:path").attr("d", line(lineData_ori)).attr("class","origin");
}
