Guest User

Untitled

a guest
Sep 23rd, 2018
84
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 19.99 KB | None | 0 0
  1. $( function() {
  2.  
  3. var json = [
  4. {
  5. "Year": "1950",
  6. "Population": "2,556,505,579",
  7. "Annual growth rate (%)": "1.45",
  8. "Population change": "37,347,602"
  9. },
  10. {
  11. "Year": "1951",
  12. "Population": "2,593,853,181",
  13. "Annual growth rate (%)": "1.6",
  14. "Population change": "41,871,643"
  15. },
  16. {
  17. "Year": "1952",
  18. "Population": "2,635,724,824",
  19. "Annual growth rate (%)": "1.7",
  20. "Population change": "45,323,546"
  21. },
  22. {
  23. "Year": "1953",
  24. "Population": "2,681,048,370",
  25. "Annual growth rate (%)": "1.78",
  26. "Population change": "48,219,116"
  27. },
  28. {
  29. "Year": "1954",
  30. "Population": "2,729,267,486",
  31. "Annual growth rate (%)": "1.88",
  32. "Population change": "51,917,512"
  33. },
  34. {
  35. "Year": "1955",
  36. "Population": "2,781,184,998",
  37. "Annual growth rate (%)": "1.9",
  38. "Population change": "53,250,385"
  39. },
  40. {
  41. "Year": "1956",
  42. "Population": "2,834,435,383",
  43. "Annual growth rate (%)": "1.96",
  44. "Population change": "56,101,768"
  45. },
  46. {
  47. "Year": "1957",
  48. "Population": "2,890,537,151",
  49. "Annual growth rate (%)": "1.95",
  50. "Population change": "56,842,854"
  51. },
  52. {
  53. "Year": "1958",
  54. "Population": "2,947,380,005",
  55. "Annual growth rate (%)": "1.77",
  56. "Population change": "52,643,623"
  57. },
  58. {
  59. "Year": "1959",
  60. "Population": "3,000,023,628",
  61. "Annual growth rate (%)": "1.4",
  62. "Population change": "42,365,981"
  63. },
  64. {
  65. "Year": "1960",
  66. "Population": "3,042,389,609",
  67. "Annual growth rate (%)": "1.34",
  68. "Population change": "41,053,737"
  69. },
  70. {
  71. "Year": "1961",
  72. "Population": "3,083,443,346",
  73. "Annual growth rate (%)": "1.81",
  74. "Population change": "56,201,866"
  75. },
  76. {
  77. "Year": "1962",
  78. "Population": "3,139,645,212",
  79. "Annual growth rate (%)": "2.2",
  80. "Population change": "69,809,783"
  81. },
  82. {
  83. "Year": "1963",
  84. "Population": "3,209,454,995",
  85. "Annual growth rate (%)": "2.2",
  86. "Population change": "71,435,095"
  87. },
  88. {
  89. "Year": "1964",
  90. "Population": "3,280,890,090",
  91. "Annual growth rate (%)": "2.09",
  92. "Population change": "69,261,354"
  93. },
  94. {
  95. "Year": "1965",
  96. "Population": "3,350,151,444",
  97. "Annual growth rate (%)": "2.08",
  98. "Population change": "70,287,296"
  99. },
  100. {
  101. "Year": "1966",
  102. "Population": "3,420,438,740",
  103. "Annual growth rate (%)": "2.02",
  104. "Population change": "69,734,541"
  105. },
  106. {
  107. "Year": "1967",
  108. "Population": "3,490,173,281",
  109. "Annual growth rate (%)": "2.04",
  110. "Population change": "72,054,474"
  111. },
  112. {
  113. "Year": "1968",
  114. "Population": "3,562,227,755",
  115. "Annual growth rate (%)": "2.08",
  116. "Population change": "74,911,189"
  117. },
  118. {
  119. "Year": "1969",
  120. "Population": "3,637,138,944",
  121. "Annual growth rate (%)": "2.06",
  122. "Population change": "75,674,674"
  123. },
  124. {
  125. "Year": "1970",
  126. "Population": "3,712,813,618",
  127. "Annual growth rate (%)": "2.08",
  128. "Population change": "77,855,248"
  129. },
  130. {
  131. "Year": "1971",
  132. "Population": "3,790,668,866",
  133. "Annual growth rate (%)": "2",
  134. "Population change": "76,494,186"
  135. },
  136. {
  137. "Year": "1972",
  138. "Population": "3,867,163,052",
  139. "Annual growth rate (%)": "1.94",
  140. "Population change": "75,826,051"
  141. },
  142. {
  143. "Year": "1973",
  144. "Population": "3,942,989,103",
  145. "Annual growth rate (%)": "1.87",
  146. "Population change": "74,626,636"
  147. },
  148. {
  149. "Year": "1974",
  150. "Population": "4,017,615,739",
  151. "Annual growth rate (%)": "1.79",
  152. "Population change": "72,591,465"
  153. },
  154. {
  155. "Year": "1975",
  156. "Population": "4,090,207,204",
  157. "Annual growth rate (%)": "1.73",
  158. "Population change": "71,216,701"
  159. },
  160. {
  161. "Year": "1976",
  162. "Population": "4,161,423,905",
  163. "Annual growth rate (%)": "1.72",
  164. "Population change": "71,989,405"
  165. },
  166. {
  167. "Year": "1977",
  168. "Population": "4,233,413,310",
  169. "Annual growth rate (%)": "1.69",
  170. "Population change": "72,083,441"
  171. },
  172. {
  173. "Year": "1978",
  174. "Population": "4,305,496,751",
  175. "Annual growth rate (%)": "1.73",
  176. "Population change": "74,933,098"
  177. },
  178. {
  179. "Year": "1979",
  180. "Population": "4,380,429,849",
  181. "Annual growth rate (%)": "1.64",
  182. "Population change": "72,256,895"
  183. },
  184. {
  185. "Year": "1980",
  186. "Population": "4,452,686,744",
  187. "Annual growth rate (%)": "1.84",
  188. "Population change": "82,712,810"
  189. },
  190. {
  191. "Year": "1981",
  192. "Population": "4,535,399,554",
  193. "Annual growth rate (%)": "1.75",
  194. "Population change": "79,967,346"
  195. },
  196. {
  197. "Year": "1982",
  198. "Population": "4,615,366,900",
  199. "Annual growth rate (%)": "1.74",
  200. "Population change": "81,043,957"
  201. },
  202. {
  203. "Year": "1983",
  204. "Population": "4,696,410,857",
  205. "Annual growth rate (%)": "1.69",
  206. "Population change": "80,166,808"
  207. },
  208. {
  209. "Year": "1984",
  210. "Population": "4,776,577,665",
  211. "Annual growth rate (%)": "1.69",
  212. "Population change": "81,519,858"
  213. },
  214. {
  215. "Year": "1985",
  216. "Population": "4,858,097,523",
  217. "Annual growth rate (%)": "1.71",
  218. "Population change": "83,727,559"
  219. },
  220. {
  221. "Year": "1986",
  222. "Population": "4,941,825,082",
  223. "Annual growth rate (%)": "1.73",
  224. "Population change": "86,219,610"
  225. },
  226. {
  227. "Year": "1987",
  228. "Population": "5,028,044,692",
  229. "Annual growth rate (%)": "1.71",
  230. "Population change": "86,904,352"
  231. },
  232. {
  233. "Year": "1988",
  234. "Population": "5,114,949,044",
  235. "Annual growth rate (%)": "1.68",
  236. "Population change": "86,553,193"
  237. },
  238. {
  239. "Year": "1989",
  240. "Population": "5,201,502,237",
  241. "Annual growth rate (%)": "1.66",
  242. "Population change": "87,326,009"
  243. },
  244. {
  245. "Year": "1990",
  246. "Population": "5,288,828,246",
  247. "Annual growth rate (%)": "1.56",
  248. "Population change": "82,961,488"
  249. },
  250. {
  251. "Year": "1991",
  252. "Population": "5,371,789,734",
  253. "Annual growth rate (%)": "1.56",
  254. "Population change": "84,615,734"
  255. },
  256. {
  257. "Year": "1992",
  258. "Population": "5,456,405,468",
  259. "Annual growth rate (%)": "1.49",
  260. "Population change": "82,021,956"
  261. },
  262. {
  263. "Year": "1993",
  264. "Population": "5,538,427,424",
  265. "Annual growth rate (%)": "1.44",
  266. "Population change": "80,603,671"
  267. },
  268. {
  269. "Year": "1994",
  270. "Population": "5,619,031,095",
  271. "Annual growth rate (%)": "1.43",
  272. "Population change": "80,882,232"
  273. },
  274. {
  275. "Year": "1995",
  276. "Population": "5,699,913,327",
  277. "Annual growth rate (%)": "1.4",
  278. "Population change": "80,077,441"
  279. },
  280. {
  281. "Year": "1996",
  282. "Population": "5,779,990,768",
  283. "Annual growth rate (%)": "1.35",
  284. "Population change": "78,382,248"
  285. },
  286. {
  287. "Year": "1997",
  288. "Population": "5,858,373,016",
  289. "Annual growth rate (%)": "1.31",
  290. "Population change": "77,368,308"
  291. },
  292. {
  293. "Year": "1998",
  294. "Population": "5,935,741,324",
  295. "Annual growth rate (%)": "1.28",
  296. "Population change": "76,699,424"
  297. },
  298. {
  299. "Year": "1999",
  300. "Population": "6,012,440,748",
  301. "Annual growth rate (%)": "1.26",
  302. "Population change": "76,242,806"
  303. },
  304. {
  305. "Year": "2000",
  306. "Population": "6,088,683,554",
  307. "Annual growth rate (%)": "1.25",
  308. "Population change": "76,640,086"
  309. },
  310. {
  311. "Year": "2001",
  312. "Population": "6,165,323,640",
  313. "Annual growth rate (%)": "1.23",
  314. "Population change": "76,394,040"
  315. },
  316. {
  317. "Year": "2002",
  318. "Population": "6,241,717,680",
  319. "Annual growth rate (%)": "1.21",
  320. "Population change": "75,708,715"
  321. },
  322. {
  323. "Year": "2003",
  324. "Population": "6,317,426,395",
  325. "Annual growth rate (%)": "1.19",
  326. "Population change": "75,694,545"
  327. },
  328. {
  329. "Year": "2004",
  330. "Population": "6,393,120,940",
  331. "Annual growth rate (%)": "1.18",
  332. "Population change": "76,008,796"
  333. },
  334. {
  335. "Year": "2005",
  336. "Population": "6,469,129,736",
  337. "Annual growth rate (%)": "1.18",
  338. "Population change": "76,754,703"
  339. },
  340. {
  341. "Year": "2006",
  342. "Population": "6,545,884,439",
  343. "Annual growth rate (%)": "1.18",
  344. "Population change": "77,687,516"
  345. },
  346. {
  347. "Year": "2007",
  348. "Population": "6,623,571,955",
  349. "Annual growth rate (%)": "1.16",
  350. "Population change": "77,193,924"
  351. },
  352. {
  353. "Year": "2008",
  354. "Population": "6,700,765,879",
  355. "Annual growth rate (%)": "1.13",
  356. "Population change": "76,151,586"
  357. },
  358. {
  359. "Year": "2009",
  360. "Population": "6,776,917,465",
  361. "Annual growth rate (%)": "1.12",
  362. "Population change": "76,101,949"
  363. },
  364. {
  365. "Year": "2010",
  366. "Population": "6,853,019,414",
  367. "Annual growth rate (%)": "1.1",
  368. "Population change": "76,078,737"
  369. },
  370. {
  371. "Year": "2011",
  372. "Population": "6,929,098,151",
  373. "Annual growth rate (%)": "1.09",
  374. "Population change": "75,690,177"
  375. },
  376. {
  377. "Year": "2012",
  378. "Population": "7,004,788,328",
  379. "Annual growth rate (%)": "1.07",
  380. "Population change": "75,387,222"
  381. },
  382. {
  383. "Year": "2013",
  384. "Population": "7,080,175,550",
  385. "Annual growth rate (%)": "1.06",
  386. "Population change": "75,338,512"
  387. },
  388. {
  389. "Year": "2014",
  390. "Population": "7,155,514,062",
  391. "Annual growth rate (%)": "1.04",
  392. "Population change": "75,049,628"
  393. },
  394. {
  395. "Year": "2015",
  396. "Population": "7,230,563,690",
  397. "Annual growth rate (%)": "1.03",
  398. "Population change": "74,655,713"
  399. },
  400. {
  401. "Year": "2016",
  402. "Population": "7,305,219,403",
  403. "Annual growth rate (%)": "1.01",
  404. "Population change": "74,180,657"
  405. },
  406. {
  407. "Year": "2017",
  408. "Population": "7,379,400,060",
  409. "Annual growth rate (%)": "0.99",
  410. "Population change": "73,486,592"
  411. },
  412. {
  413. "Year": "2018",
  414. "Population": "7,452,886,652",
  415. "Annual growth rate (%)": "0.97",
  416. "Population change": "72,652,993"
  417. },
  418. {
  419. "Year": "2019",
  420. "Population": "7,525,539,645",
  421. "Annual growth rate (%)": "0.95",
  422. "Population change": "71,699,093"
  423. },
  424. {
  425. "Year": "2020",
  426. "Population": "7,597,238,738",
  427. "Annual growth rate (%)": "0.93",
  428. "Population change": "70,803,837"
  429. },
  430. {
  431. "Year": "2021",
  432. "Population": "7,668,042,575",
  433. "Annual growth rate (%)": "0.91",
  434. "Population change": "69,932,250"
  435. },
  436. {
  437. "Year": "2022",
  438. "Population": "7,737,974,825",
  439. "Annual growth rate (%)": "0.89",
  440. "Population change": "68,927,398"
  441. },
  442. {
  443. "Year": "2023",
  444. "Population": "7,806,902,223",
  445. "Annual growth rate (%)": "0.87",
  446. "Population change": "67,841,959"
  447. },
  448. {
  449. "Year": "2024",
  450. "Population": "7,874,744,182",
  451. "Annual growth rate (%)": "0.84",
  452. "Population change": "66,699,289"
  453. },
  454. {
  455. "Year": "2025",
  456. "Population": "7,941,443,471",
  457. "Annual growth rate (%)": "0.82",
  458. "Population change": "65,627,670"
  459. },
  460. {
  461. "Year": "2026",
  462. "Population": "8,007,071,141",
  463. "Annual growth rate (%)": "0.8",
  464. "Population change": "64,618,718"
  465. },
  466. {
  467. "Year": "2027",
  468. "Population": "8,071,689,859",
  469. "Annual growth rate (%)": "0.78",
  470. "Population change": "63,569,367"
  471. },
  472. {
  473. "Year": "2028",
  474. "Population": "8,135,259,226",
  475. "Annual growth rate (%)": "0.77",
  476. "Population change": "62,498,636"
  477. },
  478. {
  479. "Year": "2029",
  480. "Population": "8,197,757,862",
  481. "Annual growth rate (%)": "0.75",
  482. "Population change": "61,409,243"
  483. },
  484. {
  485. "Year": "2030",
  486. "Population": "8,259,167,105",
  487. "Annual growth rate (%)": "0.73",
  488. "Population change": "60,387,312"
  489. },
  490. {
  491. "Year": "2031",
  492. "Population": "8,319,554,417",
  493. "Annual growth rate (%)": "0.71",
  494. "Population change": "59,434,876"
  495. },
  496. {
  497. "Year": "2032",
  498. "Population": "8,378,989,293",
  499. "Annual growth rate (%)": "0.7",
  500. "Population change": "58,473,280"
  501. },
  502. {
  503. "Year": "2033",
  504. "Population": "8,437,462,573",
  505. "Annual growth rate (%)": "0.68",
  506. "Population change": "57,495,609"
  507. },
  508. {
  509. "Year": "2034",
  510. "Population": "8,494,958,182",
  511. "Annual growth rate (%)": "0.66",
  512. "Population change": "56,487,279"
  513. },
  514. {
  515. "Year": "2035",
  516. "Population": "8,551,445,461",
  517. "Annual growth rate (%)": "0.65",
  518. "Population change": "55,520,922"
  519. },
  520. {
  521. "Year": "2036",
  522. "Population": "8,606,966,383",
  523. "Annual growth rate (%)": "0.63",
  524. "Population change": "54,605,240"
  525. },
  526. {
  527. "Year": "2037",
  528. "Population": "8,661,571,623",
  529. "Annual growth rate (%)": "0.62",
  530. "Population change": "53,671,305"
  531. },
  532. {
  533. "Year": "2038",
  534. "Population": "8,715,242,928",
  535. "Annual growth rate (%)": "0.6",
  536. "Population change": "52,712,536"
  537. },
  538. {
  539. "Year": "2039",
  540. "Population": "8,767,955,464",
  541. "Annual growth rate (%)": "0.59",
  542. "Population change": "51,724,342"
  543. },
  544. {
  545. "Year": "2040",
  546. "Population": "8,819,679,806",
  547. "Annual growth rate (%)": "0.57",
  548. "Population change": "50,774,182"
  549. },
  550. {
  551. "Year": "2041",
  552. "Population": "8,870,453,988",
  553. "Annual growth rate (%)": "0.56",
  554. "Population change": "49,865,285"
  555. },
  556. {
  557. "Year": "2042",
  558. "Population": "8,920,319,273",
  559. "Annual growth rate (%)": "0.55",
  560. "Population change": "48,921,986"
  561. },
  562. {
  563. "Year": "2043",
  564. "Population": "8,969,241,259",
  565. "Annual growth rate (%)": "0.53",
  566. "Population change": "47,940,235"
  567. },
  568. {
  569. "Year": "2044",
  570. "Population": "9,017,181,494",
  571. "Annual growth rate (%)": "0.52",
  572. "Population change": "46,926,143"
  573. },
  574. {
  575. "Year": "2045",
  576. "Population": "9,064,107,637",
  577. "Annual growth rate (%)": "0.51",
  578. "Population change": "45,941,983"
  579. },
  580. {
  581. "Year": "2046",
  582. "Population": "9,110,049,620",
  583. "Annual growth rate (%)": "0.49",
  584. "Population change": "44,990,101"
  585. },
  586. {
  587. "Year": "2047",
  588. "Population": "9,155,039,721",
  589. "Annual growth rate (%)": "0.48",
  590. "Population change": "44,017,110"
  591. },
  592. {
  593. "Year": "2048",
  594. "Population": "9,199,056,831",
  595. "Annual growth rate (%)": "0.47",
  596. "Population change": "43,026,715"
  597. },
  598. {
  599. "Year": "2049",
  600. "Population": "9,242,083,546",
  601. "Annual growth rate (%)": "0.45",
  602. "Population change": "42,023,878"
  603. }
  604. ];
  605.  
  606. var results,
  607. data = [],
  608. chart,
  609. bars,
  610. margin = 100,
  611. w = 8,
  612. h = 500,
  613. x, y,
  614. xAxis, yAxis;
  615.  
  616. results = d3.map( json );
  617. results.forEach( function( key, val ) {
  618. var result = {};
  619. result.year = new Date(parseInt( val.Year, 10 ), 1, 1);
  620. result.population = parseInt( val.Population.replace( /,/g, '' ), 10 );
  621. data.push( result );
  622. } );
  623.  
  624. chart = d3.select( 'body' ).append( 'svg' )
  625. .attr( 'class', 'chart' )
  626. .attr( 'width', 1100 )
  627. .attr( 'height', h )
  628. .append('g');
  629.  
  630. d3.select('svg g')
  631. .attr('transform', 'translate(50, 50)');
  632.  
  633. x = d3.time.scale()
  634. .domain( [data[0].year, data[data.length - 1].year] )
  635. .range( [0, (w * data.length) - (margin + w)] );
  636.  
  637. y = d3.scale.linear()
  638. .domain( [0, d3.max( data, function( d ) { return d.population; } )] )
  639. .rangeRound( [0, h - margin] );
  640.  
  641. // Bars
  642. bars = chart.append('g')
  643. .attr('class', 'bars');
  644.  
  645. bars.selectAll( 'rect' )
  646. .data( data )
  647. .enter().append( 'rect' )
  648. .attr( 'x', function( d, i ) { return x( d.year ) - .5; } )
  649. .attr( 'y', function( d ) { return (h - margin) - y( d.population ) } )
  650. .attr( 'width', w )
  651. .attr( 'height', function( d ) { return y( d.population ) } )
  652. .append('g');
  653.  
  654. // Axis
  655. xAxis = d3.svg.axis()
  656. .scale(x)
  657. .ticks(20)
  658. .tickSize(6, 3, 1);
  659.  
  660. yAxis = d3.svg.axis()
  661. .scale(d3.scale.linear().domain( [0, d3.max( data, function( d ) { return d.population; } )] ).rangeRound( [h - margin, 0] ))
  662. .ticks(4)
  663. .tickSize(6, 3, 1)
  664. .orient('right');
  665.  
  666. chart.append('g')
  667. .attr('class', 'x axis')
  668. .attr('transform', 'translate(0, ' + (h - margin) + ')')
  669. .call(xAxis);
  670.  
  671. chart.append('g')
  672. .attr('class', 'y axis')
  673. .attr('transform', 'translate(' + (x(data[data.length - 1].year) + w) + ',0)')
  674. .call(yAxis);
  675.  
  676. } );
Add Comment
Please, Sign In to add comment