Webtopo User Manual

User guide for the SVG-based Web SCADA editor built with Vue2 + JavaScript.

Live Preview

The preview is hosted on GitHub. Loading may be slow — please wait patiently.

• Editor Preview: https://webtopo-vue3.huohhz.com/?locale=en-US
• Production Preview: https://webtopo-vue3.huohhz.com/?key=model1&locale=en-US

Table of Contents

Use the left sidebar or the links below to navigate:

Getting Started

• Preview

Editor Features

• Components (Element Library)
• Decorations
• Toolbar
• Context Menu
• Element Properties
• Shortcuts

Data & Animation

• Data Binding
• Logic & Animation

Interaction & Monitoring

• Events
• Alarms
• Historical Data

Screen Graphics

• Charts
• Pipeline

About This Manual

This manual is for end users of the SCADA editor, covering how to use each feature.

To integrate the component into your own system, click the Dev Manual tab at the top.

Report issues via GitHub Issues, or email 623037142hhz@gmail.com.