@jigonzalez930209/scichart-engine
v0.4.0
Published
A high-performance scientific charting engine for web applications.
Downloads
8
Maintainers
Readme
SciChart Engine 🚀
A high-performance, WebGL-powered scientific charting engine built for precision, speed, and deep interactivity. Optimized for electrochemical and scientific data visualization.
✨ Features
- 🚀 High Performance: Render millions of data points at 60 FPS using a specialized raw WebGL renderer.
- 📈 Advanced Analysis: Built-in peak detection, integration, baseline correction, and customizable curve fitting (linear/poly/exp).
- 📊 Specialized Series: Support for Lines, Scatter (SDF symbols), Step charts, Band series, Area charts, Candlesticks (OHLC), and Stacked Charts.
- ↕️ Multi-Axis Engine: Independent scales and units with axis-specific scrolling and zooming.
- 📏 Professional Tooling: Real-time Statistics panel, Annotations (Lines/Shapes/Text), and high-fidelity SVG/PNG export.
- 🔌 Extensible: Plugin System with lifecycle hooks for custom drawing and data analysis.
- ⚛️ Framework First: Native React support via hooks and high-level components.
- 🎨 Dynamic Theming: Sleek built-in themes (Light/Midnight) with support for custom CSS-based skins.
- 🏗️ Modular Core: Built on a modern, decoupled architecture for maximum extendability.
🛠️ Installation
npm install @jigonzalez930209/scichart-engine
# or
pnpm add @jigonzalez930209/scichart-engine🚀 Quick Examples
React (Recommended)
import { SciChart } from '@jigonzalez930209/scichart-engine/react';
function App() {
const data = {
x: new Float32Array([0, 1, 2, 3]),
y: new Float32Array([10, 20, 15, 25])
};
return (
<div style={{ width: '800px', height: '400px' }}>
<SciChart
series={[{ id: 's1', ...data, color: '#00f2ff' }]}
xAxis={{ label: 'Time (s)' }}
yAxis={{ label: 'Voltage (V)' }}
showControls
/>
</div>
);
}Vanilla JavaScript
import { createChart } from '@jigonzalez930209/scichart-engine';
const chart = createChart({
container: document.getElementById('chart-container'),
title: 'Real-time Signal'
});
chart.addSeries({
id: 'signal',
type: 'line',
data: { x: [...], y: [...] }
});📖 Documentation
Visit SciChart Engine Docs for:
📄 License
MIT © jigonzalez930209
