Platform
Resources
Pricing
Sign in
Get started
Dandelion Mané
check out @sourcecred, a reputation system for open-source projects
Workspace
Fork
Published
By
Dandelion Mané
Edited
Sep 22, 2020
2
Insert cell
md
`# CredGraph Visualizer`
Insert cell
depths
=
[
5
,
3
,
3
]
Insert cell
Insert cell
Insert cell
Insert cell
import
{
select
,
checkbox
}
from
"@jashkenas/inputs"
Insert cell
sc
=
(
await
require
(
await
FileAttachment
(
"api@8.js"
)
.
url
(
)
)
)
.
default
Insert cell
credGraph
=
{
const
f
=
`https://raw.githubusercontent.com/decentralion/random-playground/master/credGraph.json`
;
const
raw
=
await
(
await
fetch
(
f
)
)
.
json
(
)
;
return
sc
.
core
.
credGraph
.
CredGraph
.
fromJSON
(
raw
)
;
}
Insert cell
Insert cell
seed
=
sc
.
core
.
markovProcessGraph
.
SEED_ADDRESS
Insert cell
hasPrefix
=
sc
.
core
.
graph
.
NodeAddress
.
hasPrefix
Insert cell
type
=
addr
=>
{
if
(
hasPrefix
(
addr
,
seed
)
)
return
"SEED"
;
if
(
hasPrefix
(
addr
,
sc
.
core
.
markovProcessGraph
.
EPOCH_PREFIX
)
)
return
"USER_EPOCH"
;
if
(
scoringAddresses
.
has
(
addr
)
)
return
"PARTICIPANT"
;
return
"CONTRIBUTION"
;
}
Insert cell
typeScale
=
d3
.
scaleOrdinal
(
[
"SEED"
,
"USER_EPOCH"
,
"PARTICIPANT"
,
"CONTRIBUTION"
]
,
[
"#EFA558"
,
"#FFBFD3"
,
"#42B9FD"
,
"#7FB84E"
]
)
Insert cell
{
const
svg
=
d3
.
create
(
"svg"
)
.
attr
(
"viewBox"
,
[
0
,
0
,
width
,
height
]
)
;
const
g
=
svg
.
append
(
"g"
)
.
attr
(
"stroke"
,
"red"
)
.
attr
(
"visibility"
,
"visible"
)
;
g
.
append
(
"text"
)
.
text
(
"hello world"
)
.
attr
(
"x"
,
10
)
.
attr
(
"y"
,
15
)
;
return
svg
.
node
(
)
;
}
Insert cell
clamp
=
(
a
,
b
)
=>
Math
.
max
(
0
,
Math
.
min
(
a
,
b
)
)
Insert cell
d3
=
require
(
"d3@5"
)
Insert cell
Insert cell
height
=
500
Insert cell
removeMd
=
require
(
'https://bundle.run/remove-markdown@0.3.0'
)
Insert cell
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Try it for free
Learn more
Fork
View
Export
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
depths
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
direction
Edit
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
includeSeed
Edit
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
chart
Edit
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
sc
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
credGraph
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
scoringAddresses
Edit
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
seed
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
hasPrefix
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
type
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
typeScale
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
clamp
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
d3
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
drag
Edit
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
height
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
removeMd
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML