sehHeiden

sehHeiden

Time series with horizotal bar with vegalite

I am trying to create a time series in vegalite. I started with values at a given end date as points and a loess fit on that as line.

But I wanted to change from points to lines of x: start and end date at the given y: value and a fit on the center of start and end date.

I computed the “mid-date” as the point of time between start and end date. The start_date is first date, that shall be included.

defmodule PollGraphs do
  def create_graph(data_source, title, col, start_date) do
    Vl.new(width: 500, height: 300, title: title)
    |> Vl.data_from_values(DF.filter(data_source, mid_date > ^start_date),
      only: ["end_date", "start_date", "mid_date", col, "category"]
    )
    |> Vl.layers([
      Vl.new()
      |> Vl.mark(:bar, opacity: 0.5)
      |> Vl.encode_field(:x, "start_date", type: :temporal, title: "poll end date")
      |> Vl.encode_field(:x2, "end_date")
      |> Vl.encode_field(:y, col, type: :quantitative, title: "percentage", scale: [domain: [param: [35, 45]]])
      |> Vl.encode_field(:color, "category", type: :nominal),
      Vl.new()
      |> Vl.mark(:line, color: "firebrick", opacity: 0.5)
      |> Vl.transform(loess: col, on: "start_date", bandwidth: 0.5)
      |> Vl.encode_field(:x, "start_date", type: :temporal, title: "poll end date")
      |> Vl.encode_field(:y, col, type: :quantitative, title: "percentage")
    ])
    
  end

I have three problems.

  • how can I get round corners working?
  • the scale in y axis is twice the size as when I used, :point and can not change it.
  • I can’t get loess fit working on “mid_date”

Marked As Solved

RemyXRenard

RemyXRenard

The rounded corners appear to interact with the type of the y axis. If you remove the “quantitative” type it will display (but won’t look like what you want). I don’t have a solution for that. It may possibly be related to https://github.com/vega/vega-lite/issues/5800, but that’s just a guess.

However, the y scale and loess transform might be resolved using the following, depending on what you’re trying to do.

Assumptions:

  • The minimal data set is the result of the DF.filter
  • The category field is different for each data point (added “category” to test_df)

For the loess, I added another layer with the mid_date and opacity set to 0, so an invisible layer. This allows the use of mid_date in the mark(:line) layer.

For the scale, I removed the “param” from the scale domain.

I hope this helps.

test_df = DF.new(
  start_date: [~N[2023-09-25 00:00:01], ~N[2023-09-25 00:00:01], ~N[2023-09-25 00:00:01],~N[2023-10-04 00:00:01] ],
  end_date: [~N[2023-09-27 00:00:01], ~N[2023-09-28 00:00:01], ~N[2023-10-02 00:00:01],~N[2023-10-05 00:00:01] ],
  mid_date: [~N[2023-09-26 00:00:01], ~N[2023-09-26 12:00:01], ~N[2023-09-28 12:00:01],~N[2023-10-04 12:00:01] ],
  col: [36, 36, 36, 37],
  category: [1,2,3,4])

    Vl.new(width: 500, height: 300, title: "Test")
    |> Vl.data_from_values(test_df)
    |> Vl.layers([
      Vl.new()
      |> Vl.mark(:bar, opacity: 0.5)
      |> Vl.encode_field(:x, "start_date", type: :temporal, title: "poll end date")
      |> Vl.encode_field(:x2, "end_date")
      |> Vl.encode_field(:y, "col", type: :quantitative, title: "percentage", scale: [domain:  [35, 45]])
      |> Vl.encode_field(:color, "category", type: :nominal),
      Vl.new()
      |> Vl.mark(:bar, opacity: 0)
      |> Vl.encode_field(:x, "mid_date", type: :temporal)
      |> Vl.encode_field(:x2, "end_date")
      |> Vl.encode_field(:y, "col", type: :quantitative, title: "percentage", scale: [domain:  [35, 45]]),
      Vl.new()
      |> Vl.mark(:line, color: "firebrick", opacity: 0.5)
      |> Vl.transform(loess: "col", on: "mid_date", bandwidth: 0.5)
      |> Vl.encode_field(:x, "mid_date", type: :temporal, title: "poll end date")
      |> Vl.encode_field(:y, "col", type: :quantitative, title: "percentage")
    ])

Where Next?

Popular in Questions Top

sen
Hi All, I set a environment variables in dev.exs , like below code. when i start server, how can i set the ${enable} value? thanks. d...
New
Harrisonl
We have an ECS cluster with 4 services, where each task joins a single cluster, via discovery ECS discovery service. Currently when I de...
New
Tee
can someone please explain to me how Enum.reduce works with maps
New
qwerescape
Is there a way to get the call stack or stack trace at any point in the code? Not from exceptions, but an expression that returns how the...
New
mgjohns61585
Could someone help me? I’m making my first elixir program, number guessing game. I can’t figure out how to convert the user’s guess from ...
New
ycv005
I have followed this StackOverflow post to install the specific version of Erlang. And When I am running mix ecto.setup then getting fol...
New
freewebwithme
Using vs code and installed ElixirLS: support and debugger. And I got an error popped up on start up says Failed to run ‘elixir’ comma...
New
srinivasu
How to handle excepions in elixir? Suppose i have A, B, C ,D, E modules. and each module has get() function. A.get() method will call t...
New
yawaramin
In the Dialyzer docs ( dialyzer — OTP 29.0.2 (dialyzer 6.0.1) ), there is a way to turn off a specific warning for a function: -dialyzer...
New
vonH
In asking this question I am more interested about the expressiveness of the language itself and less concerned about the availability of...
New

Other popular topics Top

vertexbuffer
Hello, can anybody help here..? I have a list of players and I what to delete an element, but every for loop the list is reverting to ori...
New
hariharasudhan94
lets say i have a sample like a = 20; b = 10; if (a > b) do {:ok, "a"} end if (a < b) do {:ok, b} end if (a == b) do {:ok, "equa...
New
marius95
Hello everyone, I try to use an Javascript Event Handler in my root.html.leex file. Therefore I created a function in the app.js file: ...
New
belgoros
I’m not a pro in using Regex and can’t figure out why the following behaviour happens, especially if we take into account the difference ...
New
AngeloChecked
What learn first? Rust or Elixir Hi Elixir community! I’m here because i want learn a new language. I’m a junior developer and mainly i ...
New
AstonJ
Please see the new poll here: Which code editor or IDE do you use? (Poll) (2022 Edition) It’s been a while since we first asked this, I...
208 31265 143
New
vonH
When I run the Plug and I recompile I wind up having to use Ctrl C to quit iex and start again. Witht the help of rlwrap I can use the cu...
New
grych
Hi folks, Few months ago I have announced the proof-of-concept of the library to manipulate the browsers DOM objects directly from Elixi...
639 52673 488
New
ashish173
I am using Ecto timestamps with postgres, I can see the timestamps() use the :naive_dateime but for my use case I wanted to store the ti...
New
lanycrost
Hi everyone! I need implement if…else if…else condition from my elixir code, and anymore of this control flow structures not work proper...
New

Latest on Elixir Forum

Elixir Forum

We're in Beta

About us Mission Statement