Skip to content

Commit

Permalink
make_gradient + more docs
Browse files Browse the repository at this point in the history
  • Loading branch information
@emmaccode
emmaccode authored May 12, 2024
1 parent 82fa8ca commit 9e164d2
Show file tree
Hide file tree
Showing 2 changed files with 73 additions and 59 deletions.
97 changes: 45 additions & 52 deletions src/Contexts.jl
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,44 +18,6 @@ different elements inside of the Context.
"""
abstract type AbstractContext <: ToolipsSVG.ToolipsServables.Modifier end

"""
####### compositions
Layouts in `Gattino` can be created using two techniques; scaling and composition. Using scaling
will mean that all of the visualizations in our layout are on the same `Context`. Using compositions
will mean that our visualizations will sit on seperate contexts beside one another. Scaling is done using
margins and dimensions of contexts, whereas compositions are done using `compose`, `vcat`, and `hcat`
"""
function compose end

"""
```julia
compose(name::String, cons::AbstractContext ...) -> ::Component{:div}
```
---
Composes `cons` into a new `Component{:div}` called `name`. Composing is done
using either this method, or `vcat`/`hcat`.
```example
using Gattino
firstcon = context(50, 50) do con::Context
Gattino.text!(con, 25, 25, "hello", "fill" => "black")
end
secondcon = context(50, 50) do con::Context
Gattino.text!(con, 25, 25, "world", "fill" => "black")
end
finalvis = compose("myframe", firstcon, secondcon)
```
"""
function compose(name::String, cons::AbstractContext ...)
newdiv = div(name)
newdiv[:children] = Vector{Servable}([begin
style!(con.window, "display" => "inline-block")
con.window::Component{<:Any} end for con in cons])
newdiv::Component{:div}
end

"""
```julia
vcat(comp::AbstractContext, cons::AbstractContext ...) -> ::Component{:div}
Expand Down Expand Up @@ -170,16 +132,15 @@ display(con)
"""
mutable struct Context <: AbstractContext
window::Component{:svg}
uuid::String
dim::Pair{Int64, Int64}
margin::Pair{Int64, Int64}
Context(wind::Component{:svg}, margin::Pair{Int64, Int64}) = begin
new(wind, gen_ref(5), wind[:width] => wind[:height],
new(wind, wind[:width] => wind[:height],
margin)::Context
end
Context(width::Int64 = 1280, height::Int64 = 720,
margin::Pair{Int64, Int64} = 0 => 0) = begin
window::Component{:svg} = svg("window", width = width,
window::Component{:svg} = svg(gen_ref(5), width = width,
height = height)
Context(window, margin)::Context
end
Expand Down Expand Up @@ -311,7 +272,43 @@ A `Group` is a `Context` which is held beneath another context. These
are used to create scaling with `group` and create layers with `group!`.
##### example
```
using Gattino
x = ["purple", "pink", "orange", "blue", "red", "white"]
y = [20, 40, 2, 3, 25, 49]
mycon = context(500, 500) do con::Context
group(con, 250, 250) do firstvis::Group
group!(firstvis, "axes") do g::Group
Gattino.axes!(g)
end
group!(firstvis, "grid") do g::Group
Gattino.grid!(g, 4)
end
group!(firstvis, "bars") do g::Group
Gattino.bars!(g, x, y, "stroke-width" => 1px, "stroke" => "darkgray")
[style!(comp, "fill" => color) for (comp, color) in zip(g.window[:children], x)]
end
group!(firstvis, "labels") do g::Group
Gattino.barlabels!(g, x, "stroke-width" => 0px, "font-size" => 11pt)
end
end
group(con, 250, 250, 250 => 0) do secondvis::Group
group!(secondvis, "grid2") do g::Group
Gattino.grid!(g, 4, "stroke" => "pink")
end
group!(secondvis, "line") do g::Group
Gattino.line!(g, x, y)
end
group!(secondvis, "labels") do g::Group
Gattino.gridlabels!(g, x, y, 4)
end
end
group(con, 500, 250, 0 => 250) do bottomvis::Group
group!(bottomvis, "grid3") do g::Group
Gattino.scatter_plot!(g, [1, 2, 3], [1, 2, 3])
end
end
end
```
------------------
##### constructors
Expand All @@ -322,13 +319,12 @@ Group(name::String = gen_ref(5), width::Int64 = 1280, height::Int64 = 720,
"""
mutable struct Group <: AbstractContext
window::Component{:g}
uuid::String
dim::Pair{Int64, Int64}
margin::Pair{Int64, Int64}
Group(name::String = gen_ref(5), width::Int64 = 1280, height::Int64 = 720,
margin::Pair{Int64, Int64} = 0 => 0) = begin
window::Component{:g} = ToolipsSVG.g("$name", width = width, height = height)
new(window, name, width => height, margin)
window::Component{:g} = ToolipsSVG.g(name, width = width, height = height)
new(window, width => height, margin)
end
end

Expand Down Expand Up @@ -404,12 +400,9 @@ end

"""
```julia
animate!(con::AbstractContext, layer::String, animation::ToolipsSVG.KeyFrames) -> ::Nothing
style!(con::AbstractContext, layer::String, animation::ToolipsSVG.KeyFrames) -> ::Nothing
```
Animates the layer `layer` with the animation `animation`.
```example
```
"""
function style!(con::AbstractContext, layer::String, a::ToolipsSVG.ToolipsServables.AbstractAnimation)
layer::Component{<:Any} = con.window[:children][layer]
Expand All @@ -422,10 +415,6 @@ function style!(con::AbstractContext, layer::String, a::ToolipsSVG.ToolipsServab
end
end

function animate!(f::Function, con::AbstractContext, layer::String)

end

"""
```julia
merge!(c::AbstractContext, c2::AbstractContext) -> ::Nothing
Expand Down Expand Up @@ -625,4 +614,8 @@ end

function show(io::Base.TTY, con::AbstractContext)
println(io, "Context ($(con.dim[1]) x $(con.dim[2]))")
end

function compress!(con::AbstractContext)
ToolipsSVG.ToolipsServables.compress!(con.window)::Nothing
end
35 changes: 28 additions & 7 deletions src/Gattino.jl
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,6 @@ hist #| hist_plot!
- **contexts** (exported)
```julia
AbstractContext
compose
vcat(comp::AbstractContext, cons::AbstractContext ...)
hcat(comp::AbstractContext, cons::AbstractContext ...)
vcat(comp::Component{:div}, cons::AbstractContext ...)
Expand All @@ -54,6 +53,7 @@ open_layer!
set!
set_gradient!
style!(ecomp::Pair{Int64, <:ToolipsSVG.ToolipsServables.AbstractComponent}, vec::Vector{<:Number}, stylep::Pair{String, Int64} ...)
compress!
```
- **context plotting** (not exported)
```julia
Expand Down Expand Up @@ -106,14 +106,35 @@ function randcolor()
colors[rand(1:length(colors))]::String
end

"""
```julia
make_gradient(base_color::Tuple, len::Int64, scaler::Int64 ...) -> ::Vector{String}
```
Creates a gradient of colors inside of a `Vector{String}` from `base_color` -- an `rgb` color.
`len` will be the number of colors in the resulting `Vector`. `scaler` is the values to scale the `base_color` by.
For example providing `5` as the scaler will scale red by `5` for each color. Providing `5, 10, 15` will scale
red by `5`, green by `10`, and blue by `15`.
```example
using Gattino
colors = Gattino.make_gradient((1, 100, 120), 10, 30, 10, -10)
circs = []
for e in 1:length(colors)
circy = Gattino.circle("$e", cx = 5 + (6 * e), cy = 50, r = 5)
style!(circy, "fill" => colors[e])
push!(circs, circy)
end
Gattino.svg(width = 200, height = 100, children = Vector{Gattino.ToolipsSVG.AbstractComponent}(circs))
```
"""
make_gradient(base_color::Tuple, len::Int64, scaler::Int64 ...) = begin
base = [base_color ...]
scaler = [scaler ...]
n = length(scaler)
base::Vector = [base_color ...]
scaler::Vector = [scaler ...]
n::Number = length(scaler)
[begin
[base[e] += scaler[e] for e in 1:n]
rgba(base ...)
end for e in 1:len]
end for e in 1:len]::Vector{String}
end

"""
Expand Down Expand Up @@ -568,6 +589,6 @@ function hist(features::Any, x::Any = names(features)[1], y::Any = names(feature
end

export Group, group!, style!, px, pt, group, layers, context, move_layer!, seconds, percent, Context, Animation, rgba, s, ms
export compose, delete_layer!, open_layer!, merge!, set!, set_gradient!, set_shape!
export hist, scatter, line
export delete_layer!, open_layer!, merge!, set!, set_gradient!, set_shape!, compress!, rename_layer!, move_layer!, on, ClientModifier, transition!, next!, set_text!, set_children!
export hist, scatter, line, svg, div, Component
end # module

0 comments on commit 9e164d2

Please sign in to comment.