Skip to content

VOSviewer Online is a tool for network visualization. It is a web-based version of VOSviewer, a popular tool for constructing and visualizing bibliometric networks.

License

Notifications You must be signed in to change notification settings

neesjanvaneck/VOSviewer-Online

Repository files navigation

VOSviewer Online

Build master branch License: MIT Latest release npm version DOI

VOSviewer Online is a tool for network visualization. It is a web-based version of VOSviewer, a popular tool for constructing and visualizing bibliometric networks, such as co-authorship networks, citation networks, and co-occurrence networks.

VOSviewer Online has been developed by Nees Jan van Eck and Ludo Waltman at the Centre for Science and Technology Studies (CWTS) at Leiden University.

The development of VOSviewer Online has benefited from contributions by Olya Stukova and Nikita Rokotyan from Interacta.

The development of VOSviewer Online has been supported financially by Digital Science and Zeta Alpha.

VOSviewer Online has been developed in JavaScript using React, Material-UI, D3, and a few other open source libraries.

VOSviewer Online

Usage

VOSviewer Online is hosted at https://app.vosviewer.com. Using VOSviewer Online, visualizations of bibliometric networks created by VOSviewer can be explored interactively in a web browser. To open a visualization, use the Open button at the top right of your browser window. See the documentation for an explanation of the user interface of VOSviewer Online, the interpretation of a visualization, and the file types supported by VOSviewer Online.

VOSviewer Online can also be used to share interactive visualizations by embedding these visualizations in webpages and online platforms.

Embedding VOSviewer Online in a webpage using an inline frame

VOSviewer Online can be embedded in a webpage using an inline frame (<iframe> HTML element), as illustrated by the following HTML code snippet:

<iframe
  allowfullscreen="true"
  src="https://app.vosviewer.com/?json=https://app.vosviewer.com/data/QSS_SM_2020-2021_co-authorship_network.json&simple_ui=true"
  width="100%"
  height="75%"
  style="border: 1px solid #ddd; max-width: 1200px; min-height: 500px"
>
</iframe>

For more information, see the documentation on sharing a visualization.

Integrating VOSviewer Online in a React application

VOSviewer Online can be integrated in a React application using the VOSviewer Online React component package published on npm.

Run

npm install vosviewer-online

to install the VOSviewer Online React component package.

The following code snippet illustrates the use of the VOSviewer Online React component:

import { VOSviewerOnline } from 'vosviewer-online'

<VOSviewerOnline data={{ ... }} parameters={{ ... }} />

The data and parameters props are optional. The data prop can be used to provide network data to the VOSviewer Online React component. The data must be in the VOSviewer JSON format. The parameters prop can be used to adjust the visualization of a network. The available parameters can be found here.

Documentation

Documentation of VOSviewer Online is available here.

License

VOSviewer Online is distributed under the MIT license.

Issues

If you encounter any issues, please report them using the issue tracker on GitHub.

Contribution

You are welcome to contribute to the development of VOSviewer Online. Please follow the typical GitHub workflow: Fork from this repository and make a pull request to submit your changes. Make sure that your pull request has a clear description and that the code has been properly tested.

Development and deployment

The latest stable version of the code is available from the master branch on GitHub. The most recent code, which may be under development, is available from the develop branch.

Requirements

To run VOSviewer Online locally and to build production-ready bundles, Node.js and npm need to be installed on your system.

Setup

Run

npm install

to install all required Node.js packages.

Development

Run

npm run dev

to build a development version and serve it with hot reload at http://localhost:8600.

Deployment

Run

npm run build

to build a deployment version. The production-ready minified bundle is stored in the dist/ folder.