@jmoncada/vis-graph

A web component for visualizing SPARQL knowledge graphs with D3.js and configurable visual mapping.

!npm version
!license

✨ Features

- 🚀 Simple API: Configure properties → call launch() → done!
- 🔄 Multiple data sources: SPARQL endpoints, JSON data, or manual nodes/links
- 🌐 Smart CORS handling: Automatic proxy fallback for cross-origin requests
- 🎨 Visual mapping system: JSON-based styling inspired by Vega-Lite
- 📊 Interactive visualization: Drag, zoom, hover, and contextual details
- 🔍 Intelligent data transformation: Automatic node labeling and deduplication
- 🛠️ Zero dependencies: Self-contained web component (D3.js included)

🚀 Quick Start

$3

``bash
npm install @jmoncada/vis-graph
`

📖 Quick Usage

$3

Option A: ES Module (recommended with a bundler)

`javascript
import '@jmoncada/vis-graph';
`

Option B: UMD (for direct use in browser via
`

$3

To get started with the vis-graph component and explore its capabilities, check out the vis-graph Component Guide.
This guide covers everything from basic usage to advanced configuration, including internal operation and component architecture, so you can make the most of your knowledge graph visualizations.

$3

The vis-graph component handles the complexity behind the scenes. When you call launch():

- It uses its internal SparqlDataFetcher`.
- It automatically tries to connect to the endpoint.
- If it fails due to CORS, it automatically uses the configured proxy.
- It transforms the raw SPARQL results into a graph structure (nodes and links).
- It renders the interactive graph using D3.js.

You don't need to worry about the details, just provide the configuration and the component does the rest.

Documentation

📚 Detailed guides available:

- vis-graph Component Guide - Internal operation and component architecture
- SparqlDataFetcher Guide - Simple usage of the data retrieval module
- SPARQL Proxy Configuration - Resolving CORS issues
- Domain Calculator Guide - Automatic domain calculation for visual encodings
- Color Scale Calculator Guide - Smart color palette generation
- Visual Encoding System - Complete guide to the visual encoding system

📄 License

This project is licensed under MIT.