D3.js symbol.type() Method
Last Updated :
18 Sep, 2020
The symbol.type() method takes a symbol type, sets the generators symbol that it will generate. The default symbol type, if not set, is d3.symbolCircle.
Syntax:
symbol.type([type])
Parameters: This function accepts a single parameter as mentioned above and described below:
- type: This is the type of symbol to be set.
Return Value: This method has no return value.
Example 1:
HTML
<!DOCTYPE html>
< html >
< head >
< meta charset = "utf-8" >
< script src =
</ script >
</ head >
< body >
< h1 style = "text-align:center; color:green;" >
GeeksforGeeks
</ h1 >
< h3 style = "text-align: center;" >
D3.js | symbol.type() Method
</ h3 >
< center >
< svg id = "gfg" width = "100" height = "100" ></ svg >
</ center >
< script >
var sym = d3.symbol()
.type(d3.symbolSquare).size(500);
d3.select("#gfg")
.append("path")
.attr("d", sym)
.attr("fill", "green")
.attr("transform", "translate(50,50)");
</ script >
</ body >
</ html >
|
Output:
Example 2:
HTML
<!DOCTYPE html>
< html >
< head >
< meta charset = "utf-8" >
< script src =
</ script >
</ head >
< body >
< h1 style = "text-align:center; color:green;" >
GeeksforGeeks
</ h1 >
< h3 style = "text-align: center;" >
D3.js | symbol.type() Method
</ h3 >
< center >
< svg id = "gfg" width = "100" height = "100" ></ svg >
</ center >
< script >
var sym = d3.symbol()
.type(d3.symbolCircle).size(500);
d3.select("#gfg")
.append("path")
.attr("d", sym)
.attr("fill", "green")
.attr("transform", "translate(50,50)");
</ script >
</ body >
</ html >
|
Output:
Like Article
Suggest improvement
Share your thoughts in the comments
Please Login to comment...