Commit f962c84b authored by Alexandre Delanoë's avatar Alexandre Delanoë

[Charts] factoring Trees.

parent 69858567
......@@ -11,7 +11,7 @@ import Gargantext.Components.Charts.Options.Data (DataN, DataS, DataV)
import Gargantext.Components.Charts.Options.Font (IconOptions(..), Shape(..), TextStyle, chartFontStyle, chartFontWeight, icon)
import Gargantext.Components.Charts.Options.Legend (legendType, LegendMode(..), PlainOrScroll(..), selectedMode, Orientation(..), orient)
import Gargantext.Components.Charts.Options.Position (Align(..), LeftRelativePosition(..), TopRelativePosition(..), numberPosition, percentPosition, relativePosition)
import Gargantext.Components.Charts.Options.Series (Serie(..), Series(..), toSeries, SeriesName, SeriesShape(..), seriesType, D1, D2)
import Gargantext.Components.Charts.Options.Series (Serie(..), Series(..), toSeries, SeriesName, Chart(..), seriesType, D1, D2)
import Gargantext.Components.Charts.Options.Type (DataZoom, Echarts, Legend, Option, Title, Tooltip, XAxis, YAxis)
import React (unsafeCreateElementDynamic)
import React as R
......@@ -157,13 +157,13 @@ tooltip' =
}
series :: SeriesShape -> SeriesName -> Array DataS -> D1
series :: Chart -> SeriesName -> Array DataS -> D1
series sh name ss = { name: name
, "type": seriesType sh
, "data": ss
}
seriesD2 :: SeriesShape -> Number -> Array (Array Number) -> D2
seriesD2 :: Chart -> Number -> Array (Array Number) -> D2
seriesD2 sh size ds = { "symbolSize" : size
, "data" : ds
, "type" : seriesType sh
......
......@@ -11,12 +11,13 @@ newtype SeriesType = SeriesType String
type SeriesName = String
data SeriesShape = Line
data Chart = Line
| Bar | PictorialBar
| Pie
| Scatter | EffectScatter
| Radar
| Tree | Radial | TreeMap
| Trees
| Sunburst
| Boxplot
| Candlestick
......@@ -29,27 +30,26 @@ data SeriesShape = Line
| Funnel
| Gauge
| ThemeRiver
-- Trees
instance showSeriesShape :: Show SeriesShape where
instance showChart :: Show Chart where
show Bar = "bar"
show EffectScatter = "effectScatter" -- ^ https://ecomfe.github.io/echarts-examples/public/editor.html?c=scatter-effect
show Funnel = "funnel"
show Heatmap = "heatmap"
show Line = "line"
show Pie = "pie"
show Tree = "tree" -- ^ https://ecomfe.github.io/echarts-examples/public/editor.html?c=tree-radial
show Sankey = "sankey"
show TreeMap = "treemap"
show Scatter = "scatter" -- ^ https://ecomfe.github.io/echarts-examples/public/editor.html?c=scatter-simple
show Sunburst = "sunburst"
show _ = "not implemented yet: should throw error here"
seriesType :: SeriesShape -> SeriesType
seriesType :: Chart -> SeriesType
seriesType = SeriesType <<< show
type Series = {}
data Serie = SeriesD1 D1 | SeriesD2 D2 | SerieSankey Sankey | SerieTreeMap TreeMap | SerieTree Tree
data Serie = SeriesD1 D1 | SeriesD2 D2 | SerieSankey Sankey | SerieTree Tree
type D1 =
{ name :: String
......@@ -68,7 +68,6 @@ toSeries :: Serie -> Series
toSeries (SeriesD1 a) = unsafeCoerce a
toSeries (SeriesD2 a) = unsafeCoerce a
toSeries (SerieSankey a) = unsafeCoerce a
toSeries (SerieTreeMap a) = unsafeCoerce a
toSeries (SerieTree a) = unsafeCoerce a
-- | Sankey Chart
......@@ -86,35 +85,61 @@ type Link = { source :: String
}
mkSankey :: Array Node -> Array Link -> Serie
mkSankey ns ls = SerieSankey {"type" : seriesType Sankey
mkSankey ns ls = SerieSankey { "type" : seriesType Sankey
, layout : "none"
, "data" : ns
, "links" : ls
}
-- | TreeMap Chart
-- | * Trees Chart
-- All these Trees are hierarchical Trees structure (or diagram)
-- https://en.wikipedia.org/wiki/Tree_structure
-- Tree types
data Trees = TreeLine | TreeRadial | TreeMap
instance showTrees :: Show Trees where
show TreeLine = "tree" -- ^ https://ecomfe.github.io/echarts-examples/public/editor.html?c=tree-radial
show TreeRadial = "tree" -- ^ https://ecomfe.github.io/echarts-examples/public/editor.html?c=scatter-simple
show TreeMap = "treemap" -- ^ https://ecomfe.github.io/echarts-examples/public/editor.html?c=treemap-simple
-- TreeLine is a 1-Dimension horizontal hierchical Tree
-- TreeRadial is 1-Dimension radial (as circle) Tree with no surface meaning
-- https://en.wikipedia.org/wiki/Radial_tree
-- https://ecomfe.github.io/echarts-examples/public/editor.html?c=tree-radial
-- TreeMap is a is 2-Dimension Tree with surface meaning
-- TreeMap example implementation:
-- https://ecomfe.github.io/echarts-examples/public/editor.html?c=treemap-simple
mkTreeMap :: Array TreeData -> Serie
mkTreeMap ts = SerieTreeMap { "type" : seriesType TreeMap
, "data" : map toTree ts
type Tree = { "type" :: SeriesType
, "data" :: Array TreeData
, layout :: String
}
type TreeMap = { "type" :: SeriesType
, "data" :: Array TreeData
mkTree :: Trees -> Array TreeData -> Serie
mkTree t ts = SerieTree { "type" : SeriesType (show t)
, "data" : map toJsTree ts
, layout : layout
}
where
layout = case t of
TreeRadial -> "radial"
_ -> "none"
-- ** Data Structure of the Trees
data TreeData = TreeLeaf TreeLeaf
| TreeNode TreeNode
toTree :: TreeData -> TreeData
toTree (TreeLeaf x) = unsafeCoerce x
toTree (TreeNode x) = unsafeCoerce { name : x.name
toJsTree :: TreeData -> TreeData
toJsTree (TreeLeaf x) = unsafeCoerce x
toJsTree (TreeNode x) = unsafeCoerce { name : x.name
, value : x.value
, children : (map toTree x.children)
, children : (map toJsTree x.children)
}
type TreeNode = { name :: String
, value :: Number
, children :: Array TreeData
......@@ -131,21 +156,6 @@ treeLeaf :: String -> Number -> TreeData
treeLeaf n v = TreeLeaf { name : n, value : v}
-- | Tree
-- https://ecomfe.github.io/echarts-examples/public/editor.html?c=tree-radial
type Tree = { "type" :: SeriesType
, "data" :: Array TreeData
, layout :: String
}
mkTree :: Array TreeData -> Serie
mkTree ts = SerieTree { "type" : seriesType Tree
, "data" : map toTree ts
, layout : "radial"
}
-- | TODO
-- https://ecomfe.github.io/echarts-examples/public/data/asset/data/life-expectancy-table.json
-- https://ecomfe.github.io/echarts-examples/public/editor.html?c=scatter3D-dataset&gl=1
......
......@@ -190,7 +190,7 @@ treeMapEx :: Options
treeMapEx = Options { mainTitle : ""
, subTitle : ""
, xAxis : xAxis []
, yAxis : [mkTreeMap treeData]
, yAxis : [mkTree TreeMap treeData]
, yAxisFormat : (YAxisFormat { position : ""
, visible : false
})
......@@ -199,10 +199,10 @@ treeMapEx = Options { mainTitle : ""
treeEx :: Options
treeEx = Options { mainTitle : ""
, subTitle : ""
treeEx = Options { mainTitle : "Tree"
, subTitle : "Radial"
, xAxis : xAxis []
, yAxis : [mkTree treeData']
, yAxis : [mkTree TreeRadial treeData']
, yAxisFormat : (YAxisFormat { position : ""
, visible : false
})
......@@ -210,6 +210,5 @@ treeEx = Options { mainTitle : ""
}
layoutDashboard :: forall props. Spec State props Action
layoutDashboard = simpleSpec performAction render
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