@@ -21,12 +21,14 @@ QFChart is a lightweight, feature-rich financial charting library designed for b
2121- ** 📈 Overlay Indicators** - Add indicators directly on top of the main chart (SMA, Bollinger Bands, etc.)
2222- ** 🔍 Interactive Zoom** - Smooth zooming and panning with customizable data range controls
2323
24- ### Drawing Tools
24+ ### Drawing Tools (Plugins)
25+
26+ A plugin system is used to allow adding custom drawing tools to the charts.
27+ Currently available plugins :
2528
2629- ** ✏️ Line Drawing** - Draw trend lines and support/resistance levels
2730- ** 📏 Fibonacci Retracements** - Interactive Fibonacci levels with automatic ratio calculations
2831- ** 📐 Measure Tool** - Measure price and time distances between any two points
29- - ** 🎨 Customizable Styles** - Full control over colors, line widths, and visual appearance
3032
3133### Layout & Customization
3234
@@ -47,7 +49,7 @@ QFChart is a lightweight, feature-rich financial charting library designed for b
4749### Browser (UMD)
4850
4951``` html
50- <script src =" https://unpkg.com /@qfo/qfchart/dist/qfchart.min.browser.js" ></script >
52+ <script src =" https://cdn.jsdelivr.net/npm /@qfo/qfchart/dist/qfchart.min.browser.js" ></script >
5153```
5254
5355### NPM
@@ -125,23 +127,24 @@ chart.addIndicator('SMA_20', smaPlots, {
125127
126128// Add separate pane indicator (e.g., MACD)
127129const macdPlots = {
128- macd : {
130+ histogram : {
129131 data: [
132+ { time: 1748217600000 , value: 513.1184116809054 , options: { color: ' #26A69A' } },
130133 /* ... */
131134 ],
132- options: { style: ' line ' , color: ' #2962FF ' },
135+ options: { style: ' histogram ' , color: ' #26A69A ' },
133136 },
134- signal : {
137+ macd : {
135138 data: [
136139 /* ... */
137140 ],
138- options: { style: ' line' , color: ' #FF6D00 ' },
141+ options: { style: ' line' , color: ' #2962FF ' },
139142 },
140- histogram : {
143+ signal : {
141144 data: [
142145 /* ... */
143146 ],
144- options: { style: ' histogram ' , color: ' #26A69A ' },
147+ options: { style: ' line ' , color: ' #FF6D00 ' },
145148 },
146149};
147150
0 commit comments