Skip to content

P
purescript-reactix-d3
Commit 0371e1d6 authored by Przemyslaw Kaminski's avatar Przemyslaw Kaminski
Browse files
Options

[example] links feature added, not fully working yet

parent a36b7bbb
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 208 additions and 9 deletions
example/dist/index.html
View file @ 0371e1d6
......@@ -7,6 +7,10 @@
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>svg {
border: solid 1px #ccc;
}
</style>
</head>
<body>
<!--[if lt IE 8]>
......@@ -26,6 +30,7 @@
<div id="contour"></div>
<div id="axis"></div>
<div id="time-axis"></div>
<div id="links"></div>
<!-- NOTE: it's important that this is at the end so that the DOM is ready -->
<script type="text/javascript" src="/index.fd532818.js"></script>
......
example/index.html
View file @ 0371e1d6
......@@ -7,6 +7,11 @@
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
svg {
border: solid 1px #ccc;
}
</style>
</head>
<body>
<!--[if lt IE 8]>
......@@ -26,6 +31,7 @@
<div id="contour"></div>
<div id="axis"></div>
<div id="time-axis"></div>
<div id="links"></div>
<!-- NOTE: it's important that this is at the end so that the DOM is ready -->
<script type="text/javascript" src="index.js"></script>
......
example/index.js
View file @ 0371e1d6
This diff is collapsed.
example/spago.dhall
View file @ 0371e1d6
......@@ -28,6 +28,7 @@ to generate this file without the comments in this block.
, "psci-support"
, "reactix-d3"
, "transformers"
, "tuples"
]
, packages = ./packages.dhall
, sources = [ "src/**/*.purs", "test/**/*.purs" ]
......
example/src/Main.purs
View file @ 0371e1d6
......@@ -8,6 +8,7 @@ import Data.Either (Either(..))
import Data.Int (toNumber)
import Data.Maybe (Maybe(..))
import Data.Traversable (traverse)
import Data.Tuple (Tuple(..))
import DOM.Simple.Console (log, log2)
import Effect (Effect)
import Effect.Aff (launchAff_)
......@@ -17,6 +18,7 @@ import Math
import Graphics.D3.Base
import Graphics.D3.Contour as Contour
import Graphics.D3.Link as Link
import Graphics.D3.Request
import Graphics.D3.Scale as Scale
import Graphics.D3.Selection as Selection
......@@ -133,3 +135,46 @@ main = do
>>= Selection.append "g"
>>= Axis.renderAxis timeAxis
log2 "timeScale" timeScale
let linkNodeData = [
{id: "D3", position: Tuple 2 0, parentPosition: Tuple 2 0}
, {id: "Shapes", position: Tuple 1 1, parentPosition: Tuple 2 0}
, {id: "Scales", position: Tuple 3 1, parentPosition: Tuple 2 0}
, {id: "Links", position: Tuple 0 2, parentPosition: Tuple 1 1}
, {id: "Areas", position: Tuple 1 2, parentPosition: Tuple 1 1}
, {id: "Arcs", position: Tuple 2 2, parentPosition: Tuple 1 1}
, {id: "Ordinal", position: Tuple 3 2, parentPosition: Tuple 3 1}
, {id: "Quantize", position: Tuple 4 2, parentPosition: Tuple 3 1}
]
linkXScale <- Scale.linearScale
>>= Scale.domain [0.0, 4.0]
>>= Scale.range [25.0, 175.0]
>>= Scale.toFunction
linkYScale <- Scale.linearScale
>>= Scale.domain [0.0, 2.0]
>>= Scale.range [25.0, 175.0]
>>= Scale.toFunction
linkGen <- Link.linkVertical
>>= Link.source (\d -> d.parentPosition)
>>= Link.target (\d -> d.position)
>>= Link.x (\{ position: Tuple x _ } -> linkXScale x)
>>= Link.y (\{ position: Tuple _ y } -> linkYScale y)
linkElSvg <- Selection.rootSelect "#links"
>>= Selection.append "svg"
>>= Selection.attr "width" 200.0
>>= Selection.attr "height" 200.0
_ <- Selection.selectAll ".circle" linkElSvg
>>= Selection.bindData linkNodeData
>>= Selection.join "circle"
>>= Selection.attr' "cx" (\{ position: Tuple x _ } -> linkXScale (toNumber x))
>>= Selection.attr' "cy" (\{ position: Tuple _ y } -> linkYScale (toNumber y))
>>= Selection.attr "r" "5"
>>= Selection.attr "stroke" "black"
>>= Selection.classed "circle" true
_ <- Selection.selectAll "path" linkElSvg
>>= Selection.bindData linkNodeData
>>= Selection.join "path"
>>= Selection.attr "d" linkGen
>>= Selection.attr "fill" "none"
>>= Selection.attr "stroke" "black"
log2 "linkEl" linkElSvg
spago.dhall
View file @ 0371e1d6
......@@ -18,7 +18,8 @@ to generate this file without the comments in this block.
, "functions"
, "prelude"
, "psci-support"
, "reactix" ]
, "reactix"
, "tuples" ]
, packages = ./packages.dhall
, sources = [ "src/**/*.purs", "test/**/*.purs" ]
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment