What is TechanJS and what is it used for?

TechanJS is a JavaScript library for financial charting and technical analysis, built on top of D3. You use it when you need to render stock-style charts — candlesticks, OHLC bars, volume — and overlay technical indicators such as moving averages, Ichimoku Cloud, RSI, and MACD in a modern or mobile browser. It is not a general-purpose charting library; it is aimed specifically at price/time-series data and the indicators traders look at.

What TechanJS actually provides

The library sits on D3, so it inherits D3's data-driven, SVG-based rendering model rather than shipping its own rendering engine. On top of that base it adds finance-specific chart types and indicator computations.

From the project's own listing, the supported chart and indicator set includes:

There is also a "Complete Example" on the site that combines these into one chart, which is the fastest way to see how the pieces fit together.

What problem it solves

If you tried to build a candlestick chart from scratch, you would have to handle:

• Mapping timestamps and prices to pixel coordinates
• Drawing wicks and bodies correctly for up/down periods
• Computing indicator series (e.g., an EMA, or the five lines of an Ichimoku Cloud) before you can draw them
• Keeping axes, scales, and crosshairs consistent across price and volume panels

TechanJS handles the finance-specific parts of that list — the chart primitives and the indicator math — while D3 handles the general rendering and scale machinery. That division is the main reason to pick it over a generic chart library: you get indicator calculations and financial chart shapes without writing them yourself.

When it fits, and when it doesn't

TechanJS is a reasonable choice when:

• Your data is financial time series (OHLC or close prices) and you want standard technical indicators
• You are already comfortable with D3, or willing to learn its scale/selection model
• You need interactive charts that work in modern and mobile browsers

It is a weaker fit when:

• You need chart types outside finance (the library is scoped to stock charting and technical analysis)
• You want a high-level, config-only API with no D3 exposure — TechanJS assumes you work with D3 directly
• You need indicators beyond the listed set, since anything not provided has to be computed and drawn yourself

How to start

1. Go to techanjs.org and open the Examples section to see rendered charts and their source.
2. Use the Download link to get the library, and check the Documentation page for the API surface.
3. Start from the Complete Example chart source, since it demonstrates candlestick, OHLC, volume, and indicators together — then strip out what you don't need.
4. Verify your result by comparing your rendered chart against the example with the same input data; mismatches usually come from scale domains or from feeding indicator functions data in the wrong order.

The site also links to its source and license, so you can confirm the terms before using it in a project.