JSFiddle

y2kpooh's public fiddles

  • Candlestick chart

    A candlestick chart is used to describe price movements of a security or currency for a designated span of time. Candlesticks are usually composed of the body, and an upper and a lower shadow (wick). The wick illustrates the highest and lowest prices during the time interval represented. The body illustrates the opening and closing prices. If the close price is higher than it open, the body is light or unfilled, otherwise - dark or filled. <h2>Making Candlestick with amCharts</h2> Our serial chart has a special graph type - <strong>candlestick</strong>. To have such a graph you only need to set <strong>openField</strong>, <strong>closeField</strong>, <strong>highField</strong> and <strong>lowField</strong> for the graph and have these values in your data. Candlestick graph is quite similar to <a href="/demos/ohlc-chart/">OHLC graph</a> type, which is also supported by our library. <h2>Candlesticks for long time periods</h2> If you zoom-out this chart, you will notice that candlesticks are getting more and more narrow. At some point, if you'd have even more data, they would become quite unreadable. To solve this, you could write a zoom-event handler which would change the graph type to a simple line chart if the number of data points exceeds some number X. As an alternative for this we recommend checking our <a href="/demos/multiple-panels/">Stock chart</a> which accumulate data into longer periods - for example, if you have daily data but the selected time span is very long, our stock chart can accumulate daily data into weekly or monthly or even yearly data.

  • 0xccsqb0

    D3 3.x, HTML, CSS, JavaScript

  • 2uvq6

    D3 3.x, HTML, CSS, JavaScript

  • VFR6b

    D3 3.x, HTML, CSS, JavaScript

  • hWwbr

    No-Library (pure JS), HTML, CSS, JavaScript

  • 4PcEN

    D3 3.x, HTML, CSS, JavaScript

  • zVX8r

    D3 3.x, HTML, CSS, JavaScript

  • Mxtjs

    jQuery 1.9.1, HTML, CSS, JavaScript

  • SF4Q3

    D3 3.x, HTML, CSS, JavaScript

  • jS8s6

    D3 3.x, HTML, CSS, JavaScript

  • RGzS9

    No-Library (pure JS), HTML, CSS, JavaScript

  • 3seSu

    D3 3.x, HTML, CSS, JavaScript

  • QbVJ4

    D3 3.x, HTML, CSS, JavaScript

  • EnM9j

    D3 3.x, HTML, CSS, JavaScript

  • Bz5aR

    D3 3.x, HTML, CSS, JavaScript

  • UuE8c

    D3 3.x, HTML, CSS, JavaScript

  • 23wmc

    D3 3.x, HTML, CSS, JavaScript

  • w93YK

    D3 3.x, HTML, CSS, JavaScript

  • We7Lt

    D3 3.x, HTML, CSS, JavaScript

  • gdsCK

    D3 3.x, HTML, CSS, JavaScript