<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">D3.js is also a JavaScript framework, like jquery, except that his specialty is in the data visualization of this piece. So don't think the D3 is so complicated. In the above code we can see some of the uses of D3:
Select element:d3.select ("element"), this is the $ () in jquery, but not in shorthand form.
After creating and adding a new element to the selected element:. Append ("element"), which is the Append method in JavaScript, returns a set of elements that add the new element.
Sets or gets the specified property:. attr (name[, value]), with attr () in jquery.
D3.js uses chained methods like jquery, and can continue to invoke other methods after performing an operation, but we need to note that the output type of the previous method must match the input type of the next method!
Select multiple child elements in the selected element to make up a new selection set:selectall ("obj"), create an "empty house"--selection, so that we can fill the "furniture"-data. But now the selection set has not been inserted into the document because we also have to add data to these empty selection sets?
Sets or gets the binding data for a set of elements:. Data (DataSet), so that "empty house" allocated "furniture", D3 will be based on the data to carry out a reasonable distribution, the allocation of the furniture, the next step is not to move into these small houses?
Returns a new, data-bound element:. Enter (), this way our previously created house is ready for use. They have their place in the DOM, and we can finally move on to him!
Set HTML properties:. attr ()
Set CSS style:. Style ()
D3.js Study Record