[CHARTS] Refactor and improve the echart binding. Metrics charts still missing the right colors

parent 8a840d6c
......@@ -43,5 +43,6 @@
"psc-package": "^0.3.2",
"pulp": "^12.3.0",
"purescript": "^0.12.0"
}
},
"version": "0.0.0"
}
module Gargantext.Components.Charts.Options.Color
( ChartColor()
, chartColor
( Color
, stringColor
, cssColor
, transparent
, red
, blue
, magenta
, violet
, black
) where
import Prelude
import CSS (Color, toHexString)
import CSS as CSS
import Color (rgba)
import Unsafe.Coerce (unsafeCoerce)
newtype ChartColor = ChartColor String
data Color
stringColor :: String -> Color
stringColor = unsafeCoerce
cssColor :: CSS.Color -> Color
cssColor = stringColor <<< CSS.toHexString
transparent :: Color
transparent = rgba 255 255 255 0.0
transparent = cssColor $ rgba 255 255 255 0.0
red :: Color
red = stringColor "red"
blue :: Color
blue = stringColor "blue"
magenta :: Color
magenta = stringColor "magenta"
violet :: Color
violet = cssColor CSS.violet
chartColor :: Color -> ChartColor
chartColor = ChartColor <<< toHexString
black :: Color
black = stringColor "black"
......@@ -2,17 +2,17 @@ module Gargantext.Components.Charts.Options.ECharts where
import Prelude
import CSS (black, italic, violet)
import CSS (italic)
import CSS.Common (normal)
import Data.Array (length)
import Data.Maybe (Maybe(..))
import Gargantext.Components.Charts.Options.Color (chartColor, transparent)
import Gargantext.Components.Charts.Options.Color (transparent, violet, black)
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, Chart(..), seriesType, D1, D2)
import Gargantext.Components.Charts.Options.Type (DataZoom, Echarts, Legend, Option, Title, Tooltip, XAxis, YAxis)
import Gargantext.Components.Charts.Options.Series (Series, SeriesName, Chart(..), seriesType, seriesD1)
import Gargantext.Components.Charts.Options.Type (DataZoom, Echarts, Legend, Option, Title, Tooltip, XAxis, YAxis, xAxis, yAxis)
import React (unsafeCreateElementDynamic)
import React as R
import Unsafe.Coerce (unsafeCoerce)
......@@ -25,23 +25,24 @@ chart = echarts <<< chartWith <<< opts
chartWith :: Option -> Echarts
chartWith opts = { className : Nothing
, style : Nothing
, theme : Nothing
, group : Nothing
, option : opts
, initOpts : Nothing
, notMerge : Nothing
, lazyUpdate: Nothing
, loading : Nothing
, optsLoading: Nothing
, onReady : Nothing
, resizable : Nothing
, onEvents : Nothing
}
chartWith option =
{ option
, className : Nothing
, style : Nothing
, theme : Nothing
, group : Nothing
, initOpts : Nothing
, notMerge : Nothing
, lazyUpdate: Nothing
, loading : Nothing
, optsLoading: Nothing
, onReady : Nothing
, resizable : Nothing
, onEvents : Nothing
}
echarts :: Echarts -> R.ReactElement
echarts chart = unsafeCreateElementDynamic (unsafeCoerce eChartsClass) chart []
echarts c = unsafeCreateElementDynamic (unsafeCoerce eChartsClass) c []
type MainTitle = String
type SubTitle = String
......@@ -67,12 +68,12 @@ title mainTitle subTitle =
,top: relativePosition (Relative Top)
,right: numberPosition 60.0
,bottom: percentPosition 40.0
,backgroundColor: chartColor transparent
,borderColor: chartColor transparent
,backgroundColor: transparent
,borderColor: transparent
,borderWidth: 0.0
,borderRadius: 0.0
,shadowBlur: 0.0
,shadowColor: chartColor transparent
,shadowColor: transparent
,shadowOffsetX: 0.0
,shadowOffsetY: 0.0
}
......@@ -99,7 +100,7 @@ legend =
, itemHeight: 14.0
, formatter: Nothing
, selectedMode: selectedMode $ Bool true
, inactiveColor: chartColor violet
, inactiveColor: violet
, selected: Nothing
, textStyle: textStyle
, "data": [data1]
......@@ -115,22 +116,10 @@ data3 :: DataN
data3 = {name: "Test", icon: icon $ Shape Diamond, textStyle: textStyle'}
xAxis :: Array String -> XAxis
xAxis [] = unsafeCoerce {}
xAxis xs = { "data": xData xs
, "type": "category"
, axisTick: {alignWithLabel: true}
, show: if (length xs == 0) then false else true
}
where
xData :: Array String -> Array DataV
xData xs = map (\x -> {value : x, textStyle : textStyle'}) xs
yDataVoid :: YAxis
yDataVoid =
{
"type": ""
yAxisVoid :: YAxis
yAxisVoid = yAxis
{ "type": ""
, name: ""
, min: 0
, position: ""
......@@ -138,10 +127,9 @@ yDataVoid =
, show: false
}
yData1 :: YAxis
yData1 =
{
"type": "value"
yAxis1 :: YAxis
yAxis1 = yAxis
{ "type": "value"
, name: "data"
, min: 0
, position: "left"
......@@ -151,68 +139,65 @@ yData1 =
tooltip' :: Tooltip
tooltip' =
{
trigger: "axis"
{ trigger: "axis"
, formatter: Nothing
}
series :: Chart -> SeriesName -> Array DataS -> D1
series sh name ss = { name: name
, "type": seriesType sh
, "data": ss
xAxis' :: Array String -> XAxis
xAxis' [] = unsafeCoerce {}
xAxis' xs = xAxis
{ "data": xData xs
, "type": "category"
, axisTick: {alignWithLabel: true}
, show: length xs /= 0
}
where
xData :: Array String -> Array DataV
xData = map (\x -> {value : x, textStyle : textStyle'})
-- TODO try to use Optional
yAxis' :: { position :: String
, show :: Boolean
} -> YAxis
yAxis' {position, show} = yAxis
{ "type": "value"
, name: "data"
, min: 0
, axisLabel: {formatter: "{value}"}
, position
, show
}
seriesD2 :: String -> Chart -> Number -> Array (Array Number) -> D2
seriesD2 n sh size ds = { "symbolSize" : size
, "data" : ds
, "type" : seriesType sh
, name : n
}
data YAxisFormat = YAxisFormat { position :: String
, visible :: Boolean
}
data Options = Options { mainTitle :: MainTitle
, subTitle :: SubTitle
, xAxis :: XAxis
, yAxis :: Array Serie
, yAxisFormat :: YAxisFormat
, addZoom :: Boolean
}
data Options = Options
{ mainTitle :: MainTitle
, subTitle :: SubTitle
, xAxis :: XAxis
, yAxis :: YAxis
, series :: Array Series
, addZoom :: Boolean
}
opts :: Options -> Option
opts (Options { mainTitle : mainTitle
, subTitle : subTitle
, xAxis : xs
, yAxis : ss
, yAxisFormat : (YAxisFormat { position : position
, visible : visible
})
, addZoom : addZoom}) =
opts (Options { mainTitle
, subTitle
, xAxis
, yAxis
, series
, addZoom
}) =
{ title: title mainTitle subTitle
, legend : legend
, legend
, tooltip: { trigger: "axis"
, formatter: Nothing
}
, grid : {containLabel: true}
, xAxis : xs
, series : map toSeries $ ss
, yAxis : { "type": "value"
, name: "data"
, min: 0
, position: position
, axisLabel: {formatter: "{value}"}
, show: visible
}
, grid: {containLabel: true}
, series
, xAxis
, yAxis
, dataZoom: if addZoom then [zoom Slider, zoom Inside] else []
, children : unsafeCoerce []
, children : unsafeCoerce [] -- TODO
}
data Zoom = Slider | Inside
instance showZoom :: Show Zoom where
......@@ -229,10 +214,9 @@ zoom z = {
}
seriesPie :: D1
seriesPie =
{
name: "Pie name"
seriesPie :: Series
seriesPie = seriesD1
{ name: "Pie name"
, "type": seriesType Pie
, "data": [{name: "t1", value: 50.0},
{name: "t2", value: 45.0},
......@@ -246,7 +230,7 @@ seriesPie =
textStyle2 :: TextStyle
textStyle2 =
{
color: chartColor black
color: black
,fontStyle: chartFontStyle italic
,fontWeight: chartFontWeight normal
,fontFamily: "sans-serif"
......@@ -256,10 +240,10 @@ textStyle2 =
,lineHeight: percentPosition 0.0
,width: percentPosition 100.0
,height: percentPosition 100.0
,textBorderColor: chartColor black
,textBorderColor: black
,textBorderWidth: 0.0
,textShadowColor: chartColor black
,textShadowBlur: chartColor black
,textShadowColor: black
,textShadowBlur: black
,textShadowOffsetX: 0.0
,textShadowOffsetY: 0.0
}
......@@ -267,7 +251,7 @@ textStyle2 =
textStyle' :: TextStyle
textStyle' =
{
color: chartColor black
color: black
,fontStyle: chartFontStyle normal
,fontWeight: chartFontWeight normal
,fontFamily: "sans-serif"
......@@ -277,10 +261,10 @@ textStyle' =
,lineHeight: percentPosition 0.0
,width: percentPosition 100.0
,height: percentPosition 100.0
,textBorderColor: chartColor black
,textBorderColor: black
,textBorderWidth: 1.0
,textShadowColor: chartColor black
,textShadowBlur: chartColor black
,textShadowColor: black
,textShadowBlur: black
,textShadowOffsetX: 0.0
,textShadowOffsetY: 0.0
}
......@@ -288,7 +272,7 @@ textStyle' =
textStyle :: TextStyle
textStyle =
{
color: chartColor black
color: black
,fontStyle: chartFontStyle normal
,fontWeight: chartFontWeight normal
,fontFamily: "sans-serif"
......@@ -298,10 +282,10 @@ textStyle =
,lineHeight: percentPosition 0.0
,width: percentPosition 100.0
,height: percentPosition 100.0
,textBorderColor: chartColor black
,textBorderColor: black
,textBorderWidth: 1.0
,textShadowColor: chartColor black
,textShadowBlur: chartColor black
,textShadowColor: black
,textShadowBlur: black
,textShadowOffsetX: 0.0
,textShadowOffsetY: 0.0
}
......@@ -15,15 +15,15 @@ module Gargantext.Components.Charts.Options.Font
import Prelude (Unit, ($), (<<<), (<>))
import Data.Generic.Rep
import Data.Generic.Rep.Show
import Data.Generic.Rep.Show (genericShow)
import CSS (FontStyle(..), FontWeight(..), Prefixed(..), Value(..))
import Data.String (toLower)
import Gargantext.Components.Charts.Options.Color (ChartColor)
import Gargantext.Components.Charts.Options.Color (Color)
import Gargantext.Components.Charts.Options.Position (LeftRelativePosition, Position, TopRelativePosition)
type TextStyle =
{ color :: ChartColor
{ color :: Color
, fontStyle :: ChartFontStyle
, fontWeight :: ChartFontWeight
, fontFamily :: String
......@@ -33,10 +33,10 @@ type TextStyle =
, lineHeight :: Position Unit
, width :: Position Unit
, height :: Position Unit
, textBorderColor :: ChartColor
, textBorderColor :: Color
, textBorderWidth :: Number
, textShadowColor :: ChartColor
, textShadowBlur :: ChartColor
, textShadowColor :: Color
, textShadowBlur :: Color
, textShadowOffsetX :: Number
, textShadowOffsetY :: Number
}
......
module Gargantext.Components.Charts.Options.Series where
import Effect.Exception (error, Error(..))
import Unsafe.Coerce (unsafeCoerce)
import Prelude
import Gargantext.Types (class Optional)
import Gargantext.Components.Charts.Options.Color (Color)
import Gargantext.Components.Charts.Options.Data (DataS)
data ItemStyle
type ItemStyleOptional =
( color :: Color
)
itemStyle :: forall o. Optional o ItemStyleOptional => Record o -> ItemStyle
itemStyle = unsafeCoerce
newtype SeriesType = SeriesType String
type SeriesName = String
......@@ -48,36 +58,54 @@ seriesType :: Chart -> SeriesType
seriesType = SeriesType <<< show
type Series = {}
data Serie = SeriesD1 D1 | SeriesD2 D2 | SerieSankey Sankey | SerieTree Tree
data Series
type D1 =
{ name :: String
, "type" :: SeriesType
unsafeSeries :: forall o. { | o } -> Series
unsafeSeries = unsafeCoerce
type RequiredD1 o =
{ "type" :: SeriesType
, "data" :: Array DataS
| o
}
-- | Scatter Dimension 2 data
type D2 =
{ name :: String
, "symbolSize" :: Number
, "data" :: Array (Array Number)
type OptionalD1 =
( name :: String
-- many more...
)
seriesD1 :: forall o. Optional o OptionalD1 => RequiredD1 o -> Series
seriesD1 = unsafeSeries
seriesFunnelD1 :: forall o. Optional o OptionalD1 => Record o -> Array DataS -> Series
seriesFunnelD1 o ds = seriesD1 ((unsafeCoerce o :: RequiredD1 o) { "data" = ds, "type" = seriesType Funnel })
seriesBarD1 :: forall o. Optional o OptionalD1 => Record o -> Array DataS -> Series
seriesBarD1 o ds = seriesD1 ((unsafeCoerce o :: RequiredD1 o) { "data" = ds, "type" = seriesType Bar })
seriesPieD1 :: forall o. Optional o OptionalD1 => Record o -> Array DataS -> Series
seriesPieD1 o ds = seriesD1 ((unsafeCoerce o :: RequiredD1 o) { "data" = ds, "type" = seriesType Pie })
type RequiredD2 o =
{ "data" :: Array (Array Number)
, "type" :: SeriesType
| o
}
toSeries :: Serie -> Series
toSeries (SeriesD1 a) = unsafeCoerce a
toSeries (SeriesD2 a) = unsafeCoerce a
toSeries (SerieSankey a) = unsafeCoerce a
toSeries (SerieTree a) = unsafeCoerce a
-- | Scatter Dimension 2 data
type OptionalD2 =
( name :: String
, symbolSize :: Number
, itemStyle :: ItemStyle
-- many more...
)
seriesD2 :: forall o. Optional o OptionalD2 => RequiredD2 o -> Series
seriesD2 = unsafeSeries
-- | Sankey Chart
-- https://ecomfe.github.io/echarts-examples/public/editor.html?c=sankey-simple
type Sankey = { "type" :: SeriesType
, layout :: String
, "data" :: Array Node
, "links" :: Array Link
}
seriesScatterD2 :: forall o. Optional o OptionalD2 => Record o -> Array (Array Number) -> Series
seriesScatterD2 o ds =
seriesD2 ((unsafeCoerce o :: RequiredD2 o) { "data" = ds, "type" = seriesType Scatter })
type Node = { name :: String}
type Link = { source :: String
......@@ -85,12 +113,20 @@ type Link = { source :: String
, value :: Number
}
mkSankey :: Array Node -> Array Link -> Serie
mkSankey ns ls = SerieSankey { "type" : seriesType Sankey
, layout : "none"
, "data" : ns
, "links" : ls
}
-- | Sankey Chart
-- https://ecomfe.github.io/echarts-examples/public/editor.html?c=sankey-simple
type RequiredSankey o =
{ "data" :: Array Node
, links :: Array Link
| o
}
type OptionalSankey =
( layout :: String
)
seriesSankey :: forall o. Optional o OptionalSankey => RequiredSankey o -> Series
seriesSankey o = unsafeSeries ((unsafeCoerce o) { "type" = seriesType Sankey })
-- | * Trees Chart
-- All these Trees are hierarchical Trees structure (or diagram)
......@@ -115,16 +151,24 @@ instance showTrees :: Show Trees where
-- TreeMap example implementation:
-- https://ecomfe.github.io/echarts-examples/public/editor.html?c=treemap-simple
type Tree = { "type" :: SeriesType
, "data" :: Array TreeData
, layout :: String
}
type RequiredTree o =
{ "type" :: SeriesType
, "data" :: Array TreeData
| o
}
type OptionalTree =
( layout :: String
)
seriesTree :: forall o. Optional o OptionalTree => RequiredTree o -> Series
seriesTree = unsafeSeries
mkTree :: Trees -> Array TreeData -> Serie
mkTree t ts = SerieTree { "type" : SeriesType (show t)
, "data" : map toJsTree ts
, layout : layout
}
mkTree :: Trees -> Array TreeData -> Series
mkTree t ts = seriesTree { "type" : SeriesType (show t)
, "data" : map toJsTree ts
, layout : layout
}
where
layout = case t of
TreeRadial -> "radial"
......
......@@ -2,17 +2,20 @@ module Gargantext.Components.Charts.Options.Type where
import Prelude
import CSS (Color)
import Data.Maybe (Maybe)
import Gargantext.Components.Charts.Options.Color (ChartColor)
import Gargantext.Components.Charts.Options.Color (Color)
import Gargantext.Components.Charts.Options.Data (DataN, DataV)
import Gargantext.Components.Charts.Options.Font (TextStyle)
import Gargantext.Components.Charts.Options.Legend (LegendType, Orient, SelectedMode)
import Gargantext.Components.Charts.Options.Position (LeftRelativePosition, Position, TopRelativePosition)
import Gargantext.Components.Charts.Options.Series (Series)
import Gargantext.Types (class Optional)
import React as R
import Unsafe.Coerce (unsafeCoerce)
newtype ChartAlign = ChartAlign String
-- TODO: Not sure that Maybe is working here => use Optional
type Echarts =
{ className :: Maybe String
, style :: Maybe String -- objealect-black-altdarkmincnaquadahherry-blossomect,
......@@ -60,12 +63,12 @@ type Title =
, top :: Position TopRelativePosition -- default 'auto'
, right :: Position Unit -- default 'auto'
, bottom :: Position Unit -- default 'auto'
, backgroundColor :: ChartColor -- default 'transparent''
, borderColor :: ChartColor -- default '#ccc'
, backgroundColor :: Color -- default 'transparent''
, borderColor :: Color -- default '#ccc'
, borderWidth :: Number -- default '1'
, borderRadius :: Number -- default 0; data NumberOrArray = Number | Array Number
, shadowBlur :: Number
, shadowColor :: ChartColor
, shadowColor :: Color
, shadowOffsetX :: Number
, shadowOffsetY :: Number
}
......@@ -111,7 +114,7 @@ type Legend =
, itemHeight :: Number
, formatter :: Maybe String
, selectedMode :: SelectedMode
, inactiveColor :: ChartColor
, inactiveColor :: Color
, selected :: Maybe String -- object
, textStyle :: TextStyle
, "data" :: Array DataN
......@@ -122,26 +125,39 @@ type Tooltip =
, formatter :: Maybe String -- TODO function
}
type XAxis =
{ "data" :: Array DataV
, "type" :: String
, axisTick :: AxisTick
, show :: Boolean
}
type AxisTick =
{
alignWithLabel :: Boolean
{ alignWithLabel :: Boolean
}
type YAxis =
{ "type" :: String
data XAxis
type XAxisOptional =
( "data" :: Array DataV
, "type" :: String
, axisTick :: AxisTick
, name :: String
, min :: Int
, position :: String
, axisLabel :: AxisLabel
, show :: Boolean
}
, show :: Boolean
)
xAxis :: forall o. Optional o XAxisOptional => Record o -> XAxis
xAxis = unsafeCoerce
data YAxis
type YAxisOptional =
( "type" :: String
, name :: String
, min :: Int
, position :: String
, axisLabel :: AxisLabel
, show :: Boolean
)
yAxis :: forall o. Optional o YAxisOptional => Record o -> YAxis
yAxis = unsafeCoerce
type AxisLabel =
{ formatter :: String -- string or function
......
......@@ -3,9 +3,9 @@ module Gargantext.Components.GraphExplorer.Sigmajs where
import Prelude
import Effect (Effect)
import Prim.Row (class Union)
import React (Children, ReactClass, ReactElement, createElement, unsafeCreateElement)
import Unsafe.Coerce (unsafeCoerce)
import Gargantext.Types (class Optional)
foreign import edgeShapesClass :: forall props. ReactClass props
foreign import filterClass :: forall props. ReactClass props
......@@ -64,12 +64,6 @@ foreign import data SigmaNode :: Type
foreign import data SigmaEdge :: Type
foreign import data SigmaSettings :: Type
-- | Proof that row `r` is a subset of row `s`
class Optional (r :: # Type) (s :: # Type)
instance srInstance :: Union r t s => Optional r s
type NeoCypherOptProps =
( producers :: String
, onGraphLoaded :: Effect Unit
......
......@@ -4,10 +4,8 @@ import Prelude hiding (div)
import Data.Array (zip)
import Data.Tuple (Tuple(..))
import Gargantext.Components.Charts.Options.ECharts
import Gargantext.Components.Charts.Options.ECharts (Options(..), chart, xAxis', yAxis')
import Gargantext.Components.Charts.Options.Series
import Gargantext.Components.Charts.Options.Type (Option)
import Data.Unit (Unit)
import Data.Int (toNumber)
import React.DOM (div, h1, text)
import React.DOM.Props (className)
......@@ -29,23 +27,24 @@ render dispatch _ state _ = [
, chart treeEx
]
where
myData = [SeriesD1 $ series Bar "Bar Data" [ {name: "val1", value: 50.0}
, {name: "val2", value: 70.0}
, {name: "val3", value: 80.0}
]
]
myData = [seriesBarD1 {name: "Bar Data"}
[ {name: "val1", value: 50.0}
, {name: "val2", value: 70.0}
, {name: "val3", value: 80.0}
]
]
focus :: String -> Options
focus school = Options { mainTitle : ("Focus " <> school)
, subTitle : "Total scientific publications"
, xAxis : xAxis ["2015", "2016", "2017"]
, yAxis : myData
, yAxisFormat : (YAxisFormat { position : "left"
, visible : true
})
, addZoom : false
}
focus school = Options
{ mainTitle : "Focus " <> school
, subTitle : "Total scientific publications"
, xAxis : xAxis' ["2015", "2016", "2017"]
, yAxis : yAxis' { position: "left"
, show: true
}
, series : myData
, addZoom : false
}
-----------------------------------------------------------------------------------------------------------
......@@ -58,15 +57,14 @@ naturePublis_y :: Array {name :: String, value :: Number}
naturePublis_y = map (\(Tuple n v) -> {name: n, value: toNumber v }) (zip naturePublis_x naturePublis_y')
naturePublis :: Options
naturePublis = Options { mainTitle : "Nature of publications"
, subTitle : "Distribution by type"
, xAxis : xAxis []
, yAxis : [SeriesD1 $ series Funnel "Funnel Data" naturePublis_y]
, yAxisFormat : (YAxisFormat { position : "left"
, visible : false
})
, addZoom : false
}
naturePublis = Options
{ mainTitle : "Nature of publications"
, subTitle : "Distribution by type"
, xAxis : xAxis' []
, yAxis : yAxis' { position: "left", show: false }
, series : [seriesFunnelD1 { name: "Funnel Data" } naturePublis_y]
, addZoom : false
}
-----------------------------------------------------------------------------------------------------------
......@@ -77,15 +75,14 @@ globalPublis_y = [1,4,2,1,1,2,1,1,8,38,234,76,40,82,75,202,1475,1092,1827,2630,4
globalPublis :: Options
globalPublis = (Options { mainTitle : "Global Scientific Publications"
, subTitle : "Distribution of scientific publications by IMT's Schools over time"
, xAxis : xAxis (map show globalPublis_x)
, yAxis : [SeriesD1 $ series Bar "Number of publication of IMT / year" $ map (\n -> {name: "", value: toNumber n }) globalPublis_y]
, yAxisFormat : (YAxisFormat { position : "left"
, visible : true
})
, addZoom : true
})
globalPublis = Options
{ mainTitle : "Global Scientific Publications"
, subTitle : "Distribution of scientific publications by IMT's Schools over time"
, xAxis : xAxis' (map show globalPublis_x)
, yAxis : yAxis' { position: "left", show: true }
, series : [seriesBarD1 {name: "Number of publication of IMT / year"} $ map (\n -> {name: "", value: toNumber n }) globalPublis_y]
, addZoom : true
}
......@@ -94,48 +91,50 @@ distriBySchool_y = [Tuple "Télécom Bretagne" 1150,Tuple "Télécom SudParis" 9
,Tuple "Télécom Ecole de Management" 52,Tuple "Mines Albi-Carmaux" 6]
distriBySchool :: Options
distriBySchool = Options { mainTitle : "School production in 2017"
, subTitle : "Distribution by school"
, xAxis : xAxis []
, yAxis : [ SeriesD1 $ series Pie "Pie data" (map (\(Tuple n v) -> {name: n, value: toNumber v}) distriBySchool_y)]
, yAxisFormat : (YAxisFormat { position : ""
, visible : false
})
, addZoom : false
}
distriBySchool = Options
{ mainTitle : "School production in 2017"
, subTitle : "Distribution by school"
, xAxis : xAxis' []
, yAxis : yAxis' { position : "", show: false }
, series : [ seriesPieD1 {name: "Pie data"} (map (\(Tuple n v) -> {name: n, value: toNumber v}) distriBySchool_y)]
, addZoom : false
}
scatterEx :: Options
scatterEx = Options { mainTitle : "Scatter test"
, subTitle : "Scatter subtitle"
, xAxis : xAxis []
, yAxis : [ SeriesD2 $ seriesD2 "name1" Scatter 10.0 [[2.0,3.0],[3.0,4.0]]
, SeriesD2 $ seriesD2 "name2" Scatter 5.0 [[1.0,3.0],[5.0,4.0]]
, SeriesD2 $ seriesD2 "name3" Scatter 10.0 [[10.0,3.0],[8.0,4.0]]
]
, yAxisFormat : (YAxisFormat { position : ""
, visible : true
})
, addZoom : false
}
scatterEx = Options
{ mainTitle : "Scatter test"
, subTitle : "Scatter subtitle"
, xAxis : xAxis' []
, yAxis : yAxis' { position: "", show: true }
, series : [ seriesScatterD2 {name: "name1", symbolSize: 10.0} [[2.0,3.0],[3.0,4.0]]
, seriesScatterD2 {name: "name2", symbolSize: 5.0 } [[1.0,3.0],[5.0,4.0]]
, seriesScatterD2 {name: "name3", symbolSize: 10.0} [[10.0,3.0],[8.0,4.0]]
]
, addZoom : false
}
sankeyEx :: Options
sankeyEx = Options { mainTitle : ""
, subTitle : ""
, xAxis : xAxis []
, yAxis : [ mkSankey [{name : "a"}, {name : "b"}, {name:"c"}, {name:"d"}]
[{source : "a", target : "b", value :2.0}
, {source : "a", target : "c", value :1.0}
, {source : "b", target : "c", value :1.0}
, {source : "b", target : "d", value :3.0}
]
]
, yAxisFormat : (YAxisFormat { position : ""
, visible : false
})
, addZoom : false
}
sankeyEx = Options
{ mainTitle : ""
, subTitle : ""
, xAxis : xAxis' []
, yAxis : yAxis' { position: "", show: false }
, series :
[ seriesSankey
{ "data":
[ {name : "a"}, {name : "b"}
, {name:"c"}, {name:"d"} ]
, links:
[ {source : "a", target : "b", value :2.0}
, {source : "a", target : "c", value :1.0}
, {source : "b", target : "c", value :1.0}
, {source : "b", target : "d", value :3.0}
]
, layout: "none"
}
]
, addZoom : false
}
treeData :: Array TreeData
treeData = [ treeNode "nodeA" 10.0 [ treeLeaf "nodeAa" 4.0
......@@ -183,28 +182,24 @@ treeData' = [ treeNode "nodeA" 10.0 [ treeLeaf "nodeAa" 4.0
treeMapEx :: Options
treeMapEx = Options { mainTitle : ""
, subTitle : ""
, xAxis : xAxis []
, yAxis : [mkTree TreeMap treeData]
, yAxisFormat : (YAxisFormat { position : ""
, visible : false
})
, addZoom : false
}
treeMapEx = Options
{ mainTitle : ""
, subTitle : ""
, xAxis : xAxis' []
, yAxis : yAxis' { position: "", show: false }
, series : [mkTree TreeMap treeData]
, addZoom : false
}
treeEx :: Options
treeEx = Options { mainTitle : "Tree"
, subTitle : "Radial"
, xAxis : xAxis []
, yAxis : [mkTree TreeRadial treeData']
, yAxisFormat : (YAxisFormat { position : ""
, visible : false
})
, addZoom : false
}
treeEx = Options
{ mainTitle : "Tree"
, subTitle : "Radial"
, xAxis : xAxis' []
, yAxis : yAxis' { position: "", show: false }
, series : [mkTree TreeRadial treeData']
, addZoom : false
}
layoutDashboard :: Spec {} {} Void
layoutDashboard = simpleSpec defaultPerformAction render
module Gargantext.Pages.Corpus.Metrics where
import Data.Set as Set
import Data.Array (foldl)
import Data.Tuple (Tuple(..))
import Data.Map (fromFoldableWith, Map(), keys, lookup)
import Data.Map as Map
import Data.Map (Map)
import Data.Argonaut (class DecodeJson, decodeJson, (.?))
import Data.Maybe (Maybe(..), maybe)
import Effect.Aff (Aff)
......@@ -12,10 +12,12 @@ import Gargantext.Config.REST (get)
import React (ReactClass, ReactElement, createElement)
import Thermite (Spec, Render, defaultPerformAction, simpleSpec, createClass)
import Gargantext.Prelude
import Gargantext.Types (TermList)
import Gargantext.Types (TermList(..))
import Gargantext.Components.Loader as Loader
import Gargantext.Components.Charts.Options.ECharts
import Gargantext.Components.Charts.Options.Type
import Gargantext.Components.Charts.Options.Series
import Gargantext.Components.Charts.Options.Color
type Path =
{ corpusId :: Int
......@@ -59,25 +61,33 @@ loadedMetricsSpec = simpleSpec defaultPerformAction render
render dispatch {loaded} {} _ = [chart (scatterOptions loaded)]
scatterOptions :: Array Metric -> Options
scatterOptions ds = Options
scatterOptions metrics = Options
{ mainTitle : "TODO Scatter test"
, subTitle : "TODO Scatter subtitle"
, xAxis : xAxis [] -- $ SeriesD2 $ seriesD2 Scatter 5.0 (_.x <$> ds)
, yAxis : map2series ( metric2map ds )
, yAxisFormat : (YAxisFormat { position : ""
, visible : true
})
, addZoom : false
, xAxis : xAxis { min: 0 }
, yAxis : yAxis' { position : "", show: true }
, series : map2series $ metric2map metrics
, addZoom : false
}
where
metric2map :: Array Metric -> Map TermList (Array (Array Number))
metric2map ds = fromFoldableWith (<>) $ map (\(Metric {x:x,y:y,cat:cat}) -> Tuple cat [[x,y]]) ds
metric2map :: Array Metric -> Map TermList (Array Metric)
metric2map ds = Map.fromFoldableWith (<>) $ (\(Metric m) -> Tuple m.cat [Metric m]) <$> ds
--{-
map2series :: Map TermList (Array (Array Number)) -> Array Serie
map2series ms = map (\k -> maybe (toSeries k [[]]) (toSeries k) $ lookup k ms) ((Set.toUnfoldable $ keys ms) :: (Array TermList))
map2series :: Map TermList (Array Metric) -> Array Series
map2series ms = toSeries =<< Map.toUnfoldable ms
where
toSeries k xs = SeriesD2 $ seriesD2 (show k) Scatter 5.0 xs
-- TODO colors are not respected yet
toSeries (Tuple k ms) = toSeries' color <$> ms
where
color =
case k of
StopTerm -> red
GraphTerm -> blue
CandidateTerm -> magenta
toSeries' color (Metric {label,x,y}) =
seriesScatterD2 {name: label, symbolSize: 5.0, itemStyle: itemStyle {color}}
[[x,y]]
--}
getMetrics :: Path -> Aff Loaded
......
......@@ -5,6 +5,7 @@ import Data.Argonaut ( class DecodeJson, decodeJson, class EncodeJson, encodeJso
import Data.Maybe (Maybe(..))
import Data.Either (Either(..))
import Gargantext.Prelude
import Prim.Row (class Union)
data TermSize = MonoTerm | MultiTerm
......@@ -70,3 +71,6 @@ termLists = [ { desc: "All terms", mval: Nothing }
, { desc: "Candidate terms", mval: Just CandidateTerm }
]
-- | Proof that row `r` is a subset of row `s`
class Optional (r :: # Type) (s :: # Type)
instance optionalInstance :: Union r t s => Optional r s
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