open-index/open-npm huggingface dataset:
npm package: @kinetica/kinetica-graph-viz
Description: Kinetica DB library for graph visualization
Author: Pat Khunachak
Latest version: 1.0.29

<h2>Kinetica Graph Visualization Library</h2>
Visualize graph data fom a Kinetica database

## Installation

```
npm install --save @kinetica/kinetica-graph-viz
```

## Usage

### npm

```javascript
import KineticaGraphViz from "@kinetica/kinetica-graph-viz";
const kGraphViz = new KineticaGraphViz("my_graph");

kGraphViz
  .connect("http://127.0.0.1:9191", {
    username: "admin",
    password: "password",
  })
  .nodes("graph.social_ids_nodes", ["id", "name"])
  .edges("graph.social_ids_edges", ["node1", "node2"])
  .limit(1000)
  .graph((graph) => {
    graph
      .cooldownTicks(50)
      .backgroundColor("#00000000")
      .nodeVal(() => Math.random() * 15)
      .nodeLabel((node) => `Node ${node.id}`)
      .nodeColor(() => (Math.random() > 0.5 ? "#4c00b0" : "#FF00FF"))
      .linkColor(() => (Math.random() > 0.5 ? "#4c00b0" : "#FF00FF"))
      .linkWidth(2);
  })
  .render();
```

### self-host/cdn

```javascript
<script src="build/index.js"></script>;

const KineticaGraphViz = window.KineticaGraphViz.default;
const kGraphViz = new KineticaGraphViz("my_graph");

kGraphViz
  .connect("http://127.0.0.1:9191", {
    username: "admin",
    password: "password",
  })
  .data("graph.nodes_edges", ["EDGE_NODE1_ID", "EDGE_NODE2_ID"])
  .limit(1000)
  .graph((graph) => {
    graph
      .cooldownTicks(50)
      .backgroundColor("#00000000")
      .nodeVal(() => Math.random() * 15)
      .nodeLabel((node) => `Node ${node.id}`)
      .nodeColor(() => (Math.random() > 0.5 ? "#4c00b0" : "#FF00FF"))
      .linkColor(() => (Math.random() > 0.5 ? "#4c00b0" : "#FF00FF"))
      .linkWidth(2);
  })
  .render();
```
npm package: @kinetica/react-kinetica-graph-viz
Description: Kinetica DB React component for graph visualization
Author: Pat Khunachak
Latest version: 1.0.29

<h2>Kinetica Graph Visualization React Component Library</h2>
React component to visualize graph data fom a Kinetica database

## Installation

```
npm install --save @kinetica/react-kinetica-graph-viz
```

## Usage

```javascript
import { KineticaGraphViz } from "@kinetica/react-kinetica-graph-viz";
import "./App.css";

function App() {
  return (
    <KineticaGraphViz
      id="my_graph"
      server="http://127.0.0.1:9191"
      username="admin"
      password="password"
      node_table="graph.social_ids_nodes"
      node_columns={["id", "name"]}
      edge_table="graph.social_ids_edges"
      edge_columns={["node1", "node2"]}
      limit={800}
      graph_config={(graph) => {
        graph
          .cooldownTicks(50)
          .backgroundColor("#00000000")
          .nodeVal(() => Math.random() * 15)
          .nodeLabel((node) => `Node ${node.id}`)
          .nodeColor(() => (Math.random() > 0.5 ? "#4c00b0" : "#FF00FF"))
          .linkColor(() => (Math.random() > 0.5 ? "#4c00b0" : "#FF00FF"))
          .linkWidth(2);
      }}
    />
  );
}

export default App;
```

```javascript
import { KineticaGraphViz } from "@kinetica/react-kinetica-graph-viz";
import "./App.css";

function App() {
  return (
    <KineticaGraphViz
      id="my_graph"
      server="http://127.0.0.1:9191"
      username="admin"
      password="password"
      data_table="graph.multi_out_table"
      data_columns={["EDGE_NODE1_ID", "EDGE_NODE2_ID"]}
      limit={800}
      graph_config={(graph) => {
        graph
          .cooldownTicks(50)
          .backgroundColor("#00000000")
          .nodeVal(() => Math.random() * 15)
          .nodeLabel((node) => `Node ${node.id}`)
          .nodeColor(() => (Math.random() > 0.5 ? "#4c00b0" : "#FF00FF"))
          .linkColor(() => (Math.random() > 0.5 ? "#4c00b0" : "#FF00FF"))
          .linkWidth(2);
      }}
    />
  );
}

export default App;
```
npm package: @kinetica/superset-plugin-chart-kinetica-map
Description: Superset Plugin Chart Kinetica Map
Author: Rydel Pereira
Latest version: 1.0.0

# README #

This README would normally document whatever steps are necessary to get your application up and running.

### What is this repository for? ###

* Quick summary
* Version
* [Learn Markdown](https://bitbucket.org/tutorials/markdowndemo)

### How do I get set up? ###

* Summary of set up
* Configuration
* Dependencies
* Database configuration
* How to run tests
* Deployment instructions

### Contribution guidelines ###

* Writing tests
* Code review
* Other guidelines

### Who do I talk to? ###

* Repo owner or admin
* Other community or team contact