Skip to content

Instantly share code, notes, and snippets.

@timelyportfolio

timelyportfolio/.block

Last active July 4, 2017 20:29
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save timelyportfolio/f32dc554021ac5e000609343b4b06eff to your computer and use it in GitHub Desktop.
Save timelyportfolio/f32dc554021ac5e000609343b4b06eff to your computer and use it in GitHub Desktop.
Download ZIP
d3r d3_table with igraph
Raw
.block
license: mit
Raw
README.md

assembled with blockbuilder.org

In honor of d3r 0.6.6 hitting CRAN, I wanted to do a quick example of R table to d3 node/link to igraph. Thanks svglite for the easy svg + html.

Code

library(networkD3)
library(d3r)
library(igraph)
library(pipeR)

d3_table(Titanic, c("Class","Survived")) %>>%
  { 
    ig =(as.matrix(.$links[,1:2]) + 1) %>>% graph.edgelist(directed=F)
    E(ig)$weight <- .$links[,3]
    V(ig)$name <- .$nodes[,1] %>>% t %>>% as.character
    V(ig)$weight <- .$nodes$value
    ig
  } %>>%
  (plot.igraph(
    .
    , layout=layout_as_tree
    , vertex.size = V(.)$weight/2000 * 30
    , edge.color="gray"
    , edge.width=E(.)$weight/2000 * 30
    , vertex.label = V(.)$name
  ))
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
</head>
<body style="background-color:white;">
<svg viewBox='0 0 500.25 267.75'>
<defs>
<style type='text/css'><![CDATA[
line, polyline, polygon, path, rect, circle {
fill: none;
stroke: #000000;
stroke-linecap: round;
stroke-linejoin: round;
stroke-miterlimit: 10.00;
}
]]></style>
</defs>
<rect width='100%' height='100%' style='stroke: none; fill: #FFFFFF;'/>
<defs>
<clipPath id='cpNTkuMDR8NDcwLjAxfDE5NC4zMXw1OS4wNA=='>
<rect x='59.04' y='59.04' width='410.97' height='135.27' />
</clipPath>
</defs>
<polyline points='225.77,127.93 225.72,128.11 225.42,129.15 224.79,131.38 223.88,134.54 222.89,138.01 221.95,141.31 221.12,144.22 220.39,146.75 219.75,149.02 219.13,151.16 219.10,151.29 218.48,153.44 217.84,155.69 217.12,158.20 216.30,161.09 215.36,164.37 214.37,167.84 213.46,171.03 212.80,173.34 212.48,174.45 212.42,174.65 212.42,174.65 ' style='stroke-width: 1.37; stroke: #BEBEBE;' clip-path='url(#cpNTkuMDR8NDcwLjAxfDE5NC4zMXw1OS4wNA==)' />
<polyline points='256.10,127.55 255.99,127.67 255.36,128.41 253.91,130.10 251.73,132.65 249.11,135.70 246.43,138.83 243.92,141.75 241.68,144.36 239.71,146.67 237.92,148.76 236.24,150.72 235.39,151.71 233.73,153.64 232.01,155.65 230.14,157.83 228.04,160.28 225.67,163.05 223.06,166.10 220.37,169.23 217.92,172.09 216.06,174.25 215.02,175.47 214.70,175.85 214.68,175.87 ' style='stroke-width: 1.88; stroke: #BEBEBE;' clip-path='url(#cpNTkuMDR8NDcwLjAxfDE5NC4zMXw1OS4wNA==)' />
<polyline points='285.23,128.31 285.12,128.39 284.39,128.89 282.70,130.08 279.99,131.98 276.49,134.42 272.62,137.14 268.73,139.86 265.08,142.41 261.77,144.73 258.80,146.81 256.10,148.70 253.59,150.45 251.18,152.14 250.46,152.64 248.06,154.33 245.58,156.06 242.95,157.90 240.07,159.92 236.87,162.16 233.31,164.65 229.48,167.33 225.56,170.07 221.91,172.63 218.93,174.72 216.92,176.12 215.94,176.81 215.70,176.98 215.69,176.98 ' style='stroke-width: 5.94; stroke: #BEBEBE;' clip-path='url(#cpNTkuMDR8NDcwLjAxfDE5NC4zMXw1OS4wNA==)' />
<polyline points='315.09,128.27 314.97,128.33 314.27,128.68 312.56,129.53 309.71,130.96 305.84,132.89 301.27,135.18 296.40,137.61 291.57,140.03 287.00,142.32 282.79,144.42 278.97,146.33 275.47,148.08 272.23,149.70 269.16,151.23 266.16,152.74 265.62,153.01 262.62,154.50 259.56,156.03 256.36,157.63 252.92,159.35 249.16,161.23 245.02,163.30 240.51,165.56 235.71,167.96 230.83,170.40 226.18,172.72 222.15,174.74 219.10,176.26 217.19,177.22 216.33,177.65 216.15,177.74 216.15,177.74 ' style='stroke-width: 7.57; stroke: #BEBEBE;' clip-path='url(#cpNTkuMDR8NDcwLjAxfDE5NC4zMXw1OS4wNA==)' />
<polyline points='226.49,127.93 226.54,128.10 226.83,129.12 227.46,131.34 228.37,134.52 229.39,138.09 230.38,141.55 231.26,144.64 232.03,147.33 232.72,149.73 233.36,151.97 233.60,152.80 234.23,155.01 234.89,157.33 235.62,159.90 236.46,162.83 237.41,166.16 238.43,169.74 239.41,173.14 240.16,175.78 240.58,177.25 240.70,177.66 240.70,177.67 ' style='stroke-width: 2.28; stroke: #BEBEBE;' clip-path='url(#cpNTkuMDR8NDcwLjAxfDE5NC4zMXw1OS4wNA==)' />
<polyline points='256.53,127.78 256.48,127.95 256.19,128.96 255.56,131.18 254.65,134.36 253.63,137.94 252.64,141.41 251.75,144.51 250.98,147.21 250.29,149.61 249.65,151.85 249.40,152.73 248.77,154.94 248.11,157.26 247.37,159.83 246.54,162.76 245.58,166.10 244.56,169.68 243.58,173.09 242.82,175.75 242.40,177.23 242.28,177.66 242.28,177.67 ' style='stroke-width: 1.33; stroke: #BEBEBE;' clip-path='url(#cpNTkuMDR8NDcwLjAxfDE5NC4zMXw1OS4wNA==)' />
<polyline points='285.71,128.84 285.61,128.96 284.97,129.70 283.54,131.37 281.35,133.92 278.72,136.99 276.00,140.16 273.45,143.14 271.16,145.81 269.14,148.17 267.31,150.30 265.61,152.29 264.53,153.54 262.86,155.50 261.12,157.53 259.23,159.73 257.12,162.19 254.73,164.97 252.10,168.04 249.38,171.22 246.87,174.15 244.92,176.42 243.78,177.75 243.38,178.22 243.35,178.25 ' style='stroke-width: 2.00; stroke: #BEBEBE;' clip-path='url(#cpNTkuMDR8NDcwLjAxfDE5NC4zMXw1OS4wNA==)' />
<polyline points='315.35,128.72 315.24,128.80 314.53,129.30 312.85,130.48 310.14,132.37 306.64,134.82 302.72,137.56 298.77,140.33 295.03,142.95 291.63,145.33 288.58,147.47 285.81,149.40 283.24,151.20 280.78,152.92 279.60,153.75 277.16,155.46 274.65,157.21 271.99,159.07 269.08,161.11 265.86,163.37 262.28,165.88 258.41,168.58 254.43,171.37 250.67,174.00 247.54,176.19 245.35,177.73 244.19,178.53 243.85,178.77 243.84,178.78 ' style='stroke-width: 2.38; stroke: #BEBEBE;' clip-path='url(#cpNTkuMDR8NDcwLjAxfDE5NC4zMXw1OS4wNA==)' />
<polyline points='226.98,125.68 227.09,125.56 227.74,124.80 229.20,123.10 231.38,120.55 233.95,117.55 236.56,114.51 238.97,111.70 241.10,109.21 242.99,107.01 244.70,105.01 246.32,103.12 246.71,102.67 248.32,100.78 250.01,98.82 251.84,96.68 253.91,94.26 256.26,91.52 258.83,88.52 261.44,85.48 263.75,82.78 265.40,80.86 266.23,79.89 266.43,79.66 266.43,79.66 ' style='stroke-width: 3.66; stroke: #BEBEBE;' clip-path='url(#cpNTkuMDR8NDcwLjAxfDE5NC4zMXw1OS4wNA==)' />
<polyline points='257.16,125.57 257.21,125.39 257.52,124.33 258.16,122.08 259.05,118.96 260.01,115.59 260.92,112.43 261.70,109.68 262.39,107.29 263.00,105.13 263.46,103.51 264.06,101.43 264.69,99.23 265.39,96.77 266.20,93.92 267.13,90.69 268.09,87.33 268.94,84.35 269.51,82.35 269.74,81.54 269.77,81.45 ' style='stroke-width: 3.21; stroke: #BEBEBE;' clip-path='url(#cpNTkuMDR8NDcwLjAxfDE5NC4zMXw1OS4wNA==)' />
<polyline points='286.78,123.94 286.73,123.76 286.42,122.69 285.78,120.42 284.89,117.33 283.95,114.02 283.07,110.96 282.31,108.31 281.66,106.00 281.06,103.91 280.71,102.70 280.13,100.65 279.51,98.49 278.81,96.05 278.01,93.23 277.10,90.04 276.15,86.75 275.35,83.92 274.83,82.13 274.65,81.49 274.64,81.45 ' style='stroke-width: 7.94; stroke: #BEBEBE;' clip-path='url(#cpNTkuMDR8NDcwLjAxfDE5NC4zMXw1OS4wNA==)' />
<polyline points='315.96,123.97 315.85,123.84 315.19,123.07 313.72,121.36 311.54,118.82 309.00,115.85 306.46,112.89 304.13,110.17 302.07,107.77 300.25,105.65 298.60,103.71 297.01,101.86 296.97,101.81 295.38,99.96 293.72,98.03 291.91,95.92 289.86,93.53 287.54,90.81 285.00,87.85 282.46,84.88 280.26,82.33 278.77,80.59 278.09,79.80 277.98,79.66 277.98,79.66 ' style='stroke-width: 9.96; stroke: #BEBEBE;' clip-path='url(#cpNTkuMDR8NDcwLjAxfDE5NC4zMXw1OS4wNA==)' />
<circle cx='226.13' cy='126.67' r='1.31pt' style='stroke-width: 0.75; fill: #E69F00;' clip-path='url(#cpNTkuMDR8NDcwLjAxfDE5NC4zMXw1OS4wNA==)' />
<circle cx='256.85' cy='126.67' r='1.15pt' style='stroke-width: 0.75; fill: #E69F00;' clip-path='url(#cpNTkuMDR8NDcwLjAxfDE5NC4zMXw1OS4wNA==)' />
<circle cx='287.56' cy='126.67' r='2.85pt' style='stroke-width: 0.75; fill: #E69F00;' clip-path='url(#cpNTkuMDR8NDcwLjAxfDE5NC4zMXw1OS4wNA==)' />
<circle cx='318.28' cy='126.67' r='3.57pt' style='stroke-width: 0.75; fill: #E69F00;' clip-path='url(#cpNTkuMDR8NDcwLjAxfDE5NC4zMXw1OS4wNA==)' />
<circle cx='210.77' cy='180.43' r='6.01pt' style='stroke-width: 0.75; fill: #E69F00;' clip-path='url(#cpNTkuMDR8NDcwLjAxfDE5NC4zMXw1OS4wNA==)' />
<circle cx='241.49' cy='180.43' r='2.87pt' style='stroke-width: 0.75; fill: #E69F00;' clip-path='url(#cpNTkuMDR8NDcwLjAxfDE5NC4zMXw1OS4wNA==)' />
<circle cx='272.20' cy='72.92' r='8.87pt' style='stroke-width: 0.75; fill: #E69F00;' clip-path='url(#cpNTkuMDR8NDcwLjAxfDE5NC4zMXw1OS4wNA==)' />
<defs>
<clipPath id='cpMC4wMHw1MDAuMjV8MjY3Ljc1fDAuMDA='>
<rect x='0.00' y='0.00' width='500.25' height='267.75' />
</clipPath>
</defs>
<g clip-path='url(#cpMC4wMHw1MDAuMjV8MjY3Ljc1fDAuMDA=)'><text x='219.13' y='130.64' style='font-size: 12.00px; fill: #00008B; font-family: Times New Roman;' textLength='14.00px' lengthAdjust='spacingAndGlyphs'>1st</text></g>
<g clip-path='url(#cpMC4wMHw1MDAuMjV8MjY3Ljc1fDAuMDA=)'><text x='247.85' y='130.75' style='font-size: 12.00px; fill: #00008B; font-family: Times New Roman;' textLength='18.00px' lengthAdjust='spacingAndGlyphs'>2nd</text></g>
<g clip-path='url(#cpMC4wMHw1MDAuMjV8MjY3Ljc1fDAuMDA=)'><text x='279.56' y='130.75' style='font-size: 12.00px; fill: #00008B; font-family: Times New Roman;' textLength='16.00px' lengthAdjust='spacingAndGlyphs'>3rd</text></g>
<g clip-path='url(#cpMC4wMHw1MDAuMjV8MjY3Ljc1fDAuMDA=)'><text x='305.28' y='130.64' style='font-size: 12.00px; fill: #00008B; font-family: Times New Roman;' textLength='25.99px' lengthAdjust='spacingAndGlyphs'>Crew</text></g>
<g clip-path='url(#cpMC4wMHw1MDAuMjV8MjY3Ljc1fDAuMDA=)'><text x='203.44' y='184.32' style='font-size: 12.00px; fill: #00008B; font-family: Times New Roman;' textLength='14.67px' lengthAdjust='spacingAndGlyphs'>No</text></g>
<g clip-path='url(#cpMC4wMHw1MDAuMjV8MjY3Ljc1fDAuMDA=)'><text x='232.16' y='184.32' style='font-size: 12.00px; fill: #00008B; font-family: Times New Roman;' textLength='18.66px' lengthAdjust='spacingAndGlyphs'>Yes</text></g>
<g clip-path='url(#cpMC4wMHw1MDAuMjV8MjY3Ljc1fDAuMDA=)'><text x='255.21' y='77.00' style='font-size: 12.00px; fill: #00008B; font-family: Times New Roman;' textLength='33.98px' lengthAdjust='spacingAndGlyphs'>Titanic</text></g>
</svg>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment