From 21dd71a27db45c57f8d942a9d2cf372bd9d6ae77 Mon Sep 17 00:00:00 2001
From: Binyamin Aron Green <binyaminagreen@gmail.com>
Date: Thu, 21 Mar 2019 11:58:47 -0400
Subject: [PATCH] Update two pages in d3.js guide (#26433)

* Update d3 guide

* Update index.md

* Update d3.js index.md

* Update d3js index.md
---
 .../add-document-elements-with-d3/index.md    | 22 ++++++++++++++++---
 .../data-visualization-with-d3/index.md       |  7 ++----
 2 files changed, 21 insertions(+), 8 deletions(-)

diff --git a/guide/english/certifications/data-visualization/data-visualization-with-d3/add-document-elements-with-d3/index.md b/guide/english/certifications/data-visualization/data-visualization-with-d3/add-document-elements-with-d3/index.md
index ab9f5b1b41..9a3d759e4f 100644
--- a/guide/english/certifications/data-visualization/data-visualization-with-d3/add-document-elements-with-d3/index.md
+++ b/guide/english/certifications/data-visualization/data-visualization-with-d3/add-document-elements-with-d3/index.md
@@ -3,8 +3,24 @@ title: Add Document Elements with D3
 ---
 ## Add Document Elements with D3
 
-This is a stub. <a href='https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/add-document-elements-with-d3/index.md' target='_blank' rel='nofollow'>Help our community expand it</a>.
+[This challenge](https://learn.freecodecamp.org/data-visualization/data-visualization-with-d3/add-document-elements-with-d3) introduces three core methods of **d3.js**:
+* The `d3.select()` method
+* The `d3.append()` method
+* The `d3.text()` method
 
-<a href='https://github.com/freecodecamp/guides/blob/master/README.md' target='_blank' rel='nofollow'>This quick style guide will help ensure your pull request gets accepted</a>.
+### The select() Method
+The select method is crucial, because it tells the browser where to put any _d3.js_ code written afterwords. In _Javascript_, you would write `document.getElementById('#myId');`. In _d3.js_, you would write `d3.select('#myId')`.
 
-<!-- The article goes here, in GitHub-flavored Markdown. Feel free to add YouTube videos, images, and CodePen/JSBin embeds  -->
+### The append() method
+The append method is similar to _jsx_ in _react_, markup in _html_ or the `appendChild()` method in _Javascript_. For Example, writing `d3.select('#myId').append('p')` would be the same as writing `...<p></p>...`
+
+### The text() method
+The text method is the third step in applying content to a page using _d3.js_. We have selected an element in our html and added an element. Now, we need to fill the empty element. We do that like this: `d3.select('#myId').append('p').text('sup World!')`. This is akin to writing `...<p>'sup World!</p>...` in html.
+
+### The Solution
+Add the folowing code to your editor:
+```
+d3.select('body')
+  .append('h1')
+  .text('Learning D3');
+```
diff --git a/guide/english/certifications/data-visualization/data-visualization-with-d3/index.md b/guide/english/certifications/data-visualization/data-visualization-with-d3/index.md
index ec7395a9d0..659a95fb4a 100644
--- a/guide/english/certifications/data-visualization/data-visualization-with-d3/index.md
+++ b/guide/english/certifications/data-visualization/data-visualization-with-d3/index.md
@@ -3,11 +3,8 @@ title: Data Visualization with D3
 ---
 ## Data Visualization with D3
 
-This is a stub. <a href='https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md' target='_blank' rel='nofollow'>Help our community expand it</a>.
-
-<a href='https://github.com/freecodecamp/guides/blob/master/README.md' target='_blank' rel='nofollow'>This quick style guide will help ensure your pull request gets accepted</a>.
-
-<!-- The article goes here, in GitHub-flavored Markdown. Feel free to add YouTube videos, images, and CodePen/JSBin embeds  -->
+D3.js is a JavaScript library for manipulating documents based on data. D3 helps you bring data to life using HTML, SVG, and CSS. D3’s emphasis on web standards gives you the full capabilities of modern browsers without tying yourself to a proprietary framework, combining powerful visualization components and a data-driven approach to DOM manipulation.(Source: [https://d3js.org](https://d3js.org))
 
 #### More Information:
 <!-- Please add any articles you think might be helpful to read before writing the article -->
+* [https://d3js.org](https://d3js.org)