techniq / techniq/layerchart

`CandleChart` feature request

Open
#852 1 comment 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
1.3k
Forks
41
Avg merge
2d 19h
Merged PRs (30d)
16

Description

Hey @techniq 👋,

Seems your project is skyrocketing, congratulations!
The shadcn-svelte integration is very very clean, and I'm kind of jealous of the new LineChart very simple implementation and also your latest improvement in bundle size.
I think you may have created the best visualization library on the whole internet 😳!

I would love to have the same API for candlesticks (e.g. Candlechart, sorry to annoy you again, maybe I'm the only one needing this). I know it's a relatively big feature, so I would like to start smaller.
I tried using the candlestick example and make it work with the current shadcn-svelte charts implementation, but could not manage to make something work sadly 🥲...

Anyway, here's what I tried:

<Chart
    {data}
    ... // typical arguments
    props={{
        rule: { oc: { color: "var(--chart-1)" }, hl: { color: "var(--chart-1)" } },
        highlight: { lines: true, axis: "both" },
    }}
>
    {#snippet tooltip()}
        <ChartTooltip labelFormatter={(v, _) => dayjs(v).format('LL')} />
    {/snippet}
</Chart >

Also, I tried highlight using lines instead of points, with axis: "both" on a classic LineChart and does not seem to work (only the dot shows like below). Am I doing something wrong?

Image

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the linked candlestick example and the current Chart props shown in the issue, then compare them with the existing LineChart behavior. Confirm the intended CandleChart API and whether highlight lines with axis "both" should work; completion would require a working candlestick example and verified highlighting behavior.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
data-visualization
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Quiet
Clarity
Needs clarification
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.