I want to create multiple circle with and each circle should display summary statistics like total no. of male, total no. of female., total Graduate, total non graduate, total no. of dependents and so on. I have coded few lines but it is not giving me the output I want.
=================
<!doctype html>
<html>
<head>
<style>
.bar {
fill: steelblue;
}
</style>
<script src="https://d3js.org/d3.v4.min.js"></script>
<body>
<svg width="400" height="500"></svg>
<script>
var svg = d3.select("svg"),
margin = 200,
width = svg.attr("width") - margin,
height = svg.attr("height") - margin
svg.append("text")
// .attr("transform", "translate(10,0)")
.attr("x", 50)
.attr("y", 50)
.attr("font-size", "15px")
.text("No. of Application by Male/Female")
var g = svg.append("g")
.attr("transform", "translate(" + 100 + "," + 100 + ")");
d3.csv("MnNBankLoanData.csv", function(error, data) {
if (error) {
throw error;
}
// define count object that holds count for each city
var countObj = {};
// count how much each city occurs in list and store in countObj
data.forEach(function(d) {
var education = d.Gender;
if(countObj[education] === undefined) {
// if(d.Gender === "Female") {
countObj[education] = 0;
} else {
countObj[education] = countObj[education] + 1;
}
});
// console.log(male_count);
// now store the count in each data member
data.forEach(function(d) {
var education = d.Gender;
d.count = countObj[education];
});
g.append("g")
g.selectAll("circle")
.data(data)
.enter().append("circle")
.attr("cx", 50)
.attr("cy", 50)
.attr("r", 40)
.attr("transform", "translate(" + (-5) + "," + (-50) + ")")
.attr("fill","orange");
g.selectAll("text")
.data(data)
.enter()
.append("text")
.text(function(d) {return d.count;})
.attr("transform", "translate(" + 40 + "," + 0 + ")")
.attr("font-size", "15px")
.attr("fill", "black");
});
</script>
</body>
</html>
=========================== CSV files
Loan_ID,Gender,Married,Dependents,Education,Self_Employed,ApplicantIncome,CoapplicantIncome,LoanAmount,Loan_Amount_Term,Credit_History,Property_Area,Loan_Status,State,lat,lon
LP001002,Male,No,0,Graduate,No,5849,0,,360,1,Urban,Y,New York,40.71455,-74.007124
LP001003,Male,Yes,1,Graduate,No,4583,1508,128,360,1,Rural,N,Los Angeles,34.05349,-118.245319
LP001005,Male,Yes,0,Graduate,Yes,3000,0,66,360,1,Urban,Y,Chicago,41.88415,-87.632409
LP001006,Male,Yes,0,Not Graduate,No,2583,2358,120,360,1,Urban,Y,Houston,29.76045,-95.369784
LP001008,Male,No,0,Graduate,No,6000,0,141,360,1,Urban,Y,Philadelphia,39.95228,-75.162454
LP001011,Male,Yes,2,Graduate,Yes,5417,4196,267,360,1,Urban,Y,Phoenix,33.44826,-112.075774
LP001013,Male,Yes,0,Not Graduate,No,2333,1516,95,360,1,Urban,Y,San Antonio,29.42449,-98.494619
LP001014,Male,Yes,3+,Graduate,No,3036,2504,158,360,0,Semiurban,N,San Diego,32.715695,-117.161719
LP001018,Male,Yes,2,Graduate,No,4006,1526,168,360,1,Urban,Y,Dallas,32.778155,-96.795404
LP001020,Male,Yes,1,Graduate,No,12841,10968,349,360,1,Semiurban,N,San Jose,37.338475,-121.885794
LP001024,Male,Yes,2,Graduate,No,3200,700,70,360,1,Urban,Y,Austin,30.267605,-97.742984
LP001027,Male,Yes,2,Graduate,,2500,1840,109,360,1,Urban,Y,Jacksonville,30.33147,-81.656219
LP001028,Male,Yes,2,Graduate,No,3073,8106,200,360,1,Urban,Y,San Francisco,37.777125,-122.419644
LP001029,Male,No,0,Graduate,No,1853,2840,114,360,1,Rural,N,Indianapolis,39.76691,-86.149964
LP001030,Male,Yes,2,Graduate,No,1299,1086,17,120,1,Urban,Y,Columbus,39.96196,-83.002984
LP001032,Male,No,0,Graduate,No,4950,0,125,360,1,Urban,Y,Fort Worth,32.748855,-97.329389
LP001034,Male,No,1,Not Graduate,No,3596,0,100,240,,Urban,Y,Charlotte,35.22269,-80.837764
LP001036,Female,No,0,Graduate,No,3510,0,76,360,0,Urban,N,Seattle,47.60356,-122.329439
LP001038,Male,Yes,0,Not Graduate,No,4887,0,133,360,1,Rural,N,Denver,39.74001,-104.992259
LP001041,Male,Yes,0,Graduate,,2600,3500,115,,1,Urban,Y,El Paso,31.759165,-106.487494
LP001043,Male,Yes,0,Not Graduate,No,7660,0,104,360,0,Urban,N,Detroit,42.331685,-83.047924
LP001046,Male,Yes,1,Graduate,No,5955,5625,315,360,1,Urban,Y,Washington,38.89037,-77.031959
LP001047,Male,Yes,0,Not Graduate,No,2600,1911,116,360,0,Semiurban,N,Boston,42.358635,-71.056699
LP001050,Male,Yes,2,Not Graduate,No,3365,1917,112,360,0,Rural,N,Memphis,35.149766,-90.049259
LP001052,Male,Yes,1,Graduate,,3717,2925,151,360,,Semiurban,N,Nashville-Davidson,36.167783,-86.778365
LP001066,Male,Yes,0,Graduate,Yes,9560,0,191,360,1,Semiurban,Y,Portland,45.511795,-122.675629
LP001068,Male,Yes,0,Graduate,No,2799,2253,122,360,1,Semiurban,Y,Oklahoma City,35.472015,-97.520354
LP001073,Male,Yes,2,Not Graduate,No,4226,1040,110,360,1,Urban,Y,Las Vegas,36.171915,-115.139974
LP001086,Male,No,0,Not Graduate,No,1442,0,35,360,1,Urban,N,Baltimore,39.290585,-76.609264