robotics ui
1.0.0
Robotika UI adalah solusi antarmuka web untuk robot bertenaga ROS 2 menggunakan besi React dan ROS 2.
Visi kami adalah membuat perangkat lunak yang memungkinkan Anda untuk secara instan menambahkan antarmuka web ke setiap robot ROS 2 dengan mengonfigurasi file JSON sederhana.
Alat ini terdiri dari dua bagian: backend python, yang bertindak sebagai lapisan terjemahan antara ROS 2 dan frontend React. Untuk mencapai ini, kami menerjemahkan pesan ROS 2 ke JSON dan kembali.
Di frontend, kami menggunakan desain berbasis jendela di mana setiap jendela adalah program mikro sendiri yang berinteraksi dengan data JSON dari backend. Ini memungkinkan kami untuk mengambil pendekatan gaya plugin dan bagi pengguna untuk menyesuaikan dasbor mereka. Tujuannya adalah agar pengguna membuat plugin khusus mereka sendiri.
Ada juga dukungan telepon yang menampilkan desain yang lebih kompak.
Pengaturan besi ros 2 yang kami gunakan
Untuk menggunakan paket ROS 2, Anda perlu menginstal paket berikut:
Pengaturan Ros
export ROS_DISTRO=ironSiapkan FASTAPI
sudo apt install python3-pip
pip install fastapi
pip install uvicorn Ketergantungan lainnya
pip install pyyamlInstal NVM
sudo apt update
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.35.3/install.sh | bash
nvm install nodeArahkan ke folder SRC ROS 2 Workspace Anda dan unduh paket
cd ~ /ros2_ws/src
git clone https://github.com/sciotaio/robotics-ui.git Arahkan ke folder ruang kerja Anda dan instal paket ros2_webinterface
cd ~ /ros2_ws
colcon build --packages-select ros2_webinterface && source install/setup.bashArahkan ke folder Proyek React
cd ~ /ros2_ws/src/robotics-web/react/robotics_ui/Pasang dependensi dengan NPM
npm install # test launch
ros2 launch ros2_webinterface test.launch.py
# main launch (only the webinterface)
ros2 launch ros2_webinterface webinterface.launch.py
# waypoint_manager launch (Backend for the OpenStreetMap Plugin)
ros2 launch ros2_webinterface waypoint_manager.launch.py cd ~ /ros2_ws/src/robotics-web/react/robotics_ui/
npm startTODO: Jelaskan cara mengubah pengaturan host dan proxy dan cara mengubah alamat backend
Panduan Pengguna menjelaskan cara menyesuaikan aplikasi dan cara menggunakannya dalam proyek Anda.
Panduan ini menjelaskan cara membuat dan mengonfigurasi file konfigurasi JSON untuk membuat dasbor khusus Anda.
Mulailah frontend dan buka di browser web (alamat default http: // localhost: 3000/)
Halaman berikut harus dibuka:
Pergi ke bagian editor JSON.
Di editor JSON, Anda memiliki beberapa opsi:
Anda dapat mengunggah file konfigurasi JSON atau tautan dasbor.
Tautan dasbor menyertakan konfigurasi JSON sebagai parameter tautan. Misalnya: http: // localhost: 3000/dashboard/pengaturan? component = [{"id": "stringtopic", "state": false, "render_type": "string", "position": {"x": 0, "y": 0}, "size": {"Lebar": 200, "Tinggi": 200}, "Topik": [{"Name": "Topic1", "Topic": "/Topic1", "Type": "String", "Route": "/Pelanggan/Topik1"}]}] & preset_list = tidak ditentukan
Untuk menerapkan tautan JSON, Anda kemudian dapat mengklik tombol "Terapkan Link JSON".
Atau Anda dapat menggunakan tombol "Terapkan Tautan JSON" untuk memilih tautan demo yang telah disimpan.
Untuk mengonfigurasi file JSON, Anda dapat menggunakan formulir web.
Sebagai pengantar, mari kita tambahkan komponen sederhana:
Dalam kasus kami, tipe render string hadir dengan topik yang sudah dikonfigurasi sebelumnya.
Selanjutnya, kita harus mengkonfigurasi topik komponen. Topik memberikan frontend informasi yang diperlukan untuk membuat panggilan API ke backend, dan masing -masing memiliki 4 properti:
Jumlah dan urutan topik ditentukan oleh jenis plugin yang kami gunakan, jadi konsultasikan dengan dokumentasi plugin untuk informasi itu.
Jika kami ingin menghapus atau menambahkan topik, kami dapat menggunakan tombol "Tambah Topik" atau "Hapus Topik".
Untuk menggunakan konfigurasi, kami memiliki beberapa opsi:
Dengan tombol "Hasilkan JSON", kami dapat mencetak file JSON ke konsol alat dev.
Dengan tombol "Unduh JSON", kami dapat mengunduh file JSON.
Dengan tombol "Gunakan JSON", kami dapat langsung membuka dasbor dengan pengaturan yang dikonfigurasi.
Jika Anda ingin mengakses dasbor yang sama persis di masa mendatang, Anda juga dapat menyalin tautan di bagian tautan.
Untuk menggunakan file konfigurasi khusus di backend, Anda harus mengatur ini sebagai properti di file peluncuran khusus Anda.
Contoh file peluncuran bisa terlihat seperti ini:
import os
from launch import LaunchDescription
from launch_ros . actions import Node
from launch . actions import IncludeLaunchDescription
from launch . launch_description_sources import PythonLaunchDescriptionSource
from ament_index_python . packages import get_package_share_directory
def generate_launch_description ():
share_dir = get_package_share_directory ( 'ros2_webinterface' )
launch_dir = os . path . join ( share_dir , 'launch' )
webinterface = IncludeLaunchDescription (
PythonLaunchDescriptionSource (
os . path . join ( launch_dir , 'webinterface.launch.py' )
),
launch_arguments = {
"yaml_config" : "topic_list.yaml" , # Name of the YAML config
file
"json_config" : "topic_list.json" , # Name of the JSON config file
"config_folder" : 'default' , # Path to the folder
# or 'default' to use the
# standard config folder
}. items (),
)
ld = LaunchDescription ()
ld . add_action ( webinterface )
return ldFile YAML dapat kosong - secara otomatis ditimpa dengan konfigurasi yang benar pada peluncuran.
Plugin memungkinkan Anda untuk menyesuaikan dasbor Anda lebih jauh.
Aplikasi saat ini dilengkapi dengan 3 plugin yang berbeda.
Panduan Plugin Peta Peta Jalanan
Open Street Map Center memungkinkan Anda melacak robot Anda di peta dan mengirim instruksi GPS Waypoint dengan klik sederhana.
Anda juga dapat berpusat pada robot dengan tombol tengah serta menghapus dan mengatur titik arah.
Plugin ini memungkinkan Anda untuk hanya menampilkan data JSON yang masuk.
Kirimkan saran Anda untuk plugin Anda.
Panduan tentang Cara Menginstal dan Mengkonfigurasi Plugin:
Panduan Plugin
std_msgs.msg
sensor_msgs.msg
std_msgs.msg
Lebih banyak format yang datang dalam pembaruan mendatang.
