Rumah hujung hadapan web tutorial js Membuat aplikasi Web dengan MATLAB dan Mean Stack

Membuat aplikasi Web dengan MATLAB dan Mean Stack

Feb 19, 2025 pm 01:22 PM

Creating a Web App with MATLAB and the MEAN Stack

mata teras

    Matlab, bahasa peringkat tinggi untuk pengkomputeran teknikal, boleh diintegrasikan dengan tumpukan min untuk membuat aplikasi web yang kuat.
  • Stack min terdiri daripada mongoDB, express.js, angularjs dan node.js, dan apabila digunakan bersama dengan MATLAB, ia membolehkan visualisasi data masa nyata di web.
  • Proses integrasi melibatkan menggunakan kuasa pengkomputeran MATLAB untuk memproses data dan menghasilkan hasil, yang kemudian dipaparkan pada aplikasi web yang dibina menggunakan timbunan min.
  • JSONLAB, pelaksanaan Open Source JSON/Decoder Open Source Free dalam bahasa MATLAB, digunakan untuk menukar data MATLAB ke format JSON untuk digunakan dalam aplikasi web.
  • Mewujudkan aplikasi Web MATLAB termasuk membuat aplikasi mandiri menggunakan pengkompil Matlab, membuat projek aplikasi web dalam pelayan aplikasi Web MATLAB, memuat naik aplikasi mandiri ke projek aplikasi web, dan menggunakan aplikasi web kepada pengguna.
MATLAB adalah bahasa peringkat tinggi untuk pengkomputeran teknikal yang mengintegrasikan pengkomputeran, visualisasi dan pengaturcaraan dalam persekitaran yang mudah digunakan di mana masalah dan penyelesaian dapat dinyatakan dalam notasi matematik yang biasa. Terdapat banyak projek di seluruh dunia yang ditulis di MATLAB dan dibangunkan oleh berjuta -juta saintis dan jurutera. Pelbagai data eksperimen dan operasi yang diperoleh dari MATLAB boleh digunakan untuk menyokong aplikasi web, tetapi terdapat beberapa halangan:

    MATLAB memahami data format matriks, manakala aplikasi web lebih suka data dalam format JSON atau XML.
  • Data biasanya dibuat dan digunakan dalam program MATLAB, yang membatasi kebebasan pemaju dalam menjimatkan dan menggunakan data, dll.
Membuat aplikasi lebih mudah jika MATLAB menghidangkan data dalam format JSON dan aplikasi web boleh menggunakan data JSON ini dari MATLAB untuk membuat sesuatu yang hebat.

Dalam artikel ini, kami akan membangunkan program demonstrasi kecil untuk menunjukkan cara membuat MATLAB dan Mean Stack berfungsi bersama -sama.

Mengenai Aplikasi Web

Aplikasi web ini akan melibatkan pemindahan data masa nyata dari MATLAB ke pelayar. Untuk kesederhanaan, kami akan memindahkan masa semasa dari MATLAB dan memaparkannya pada penyemak imbas. Kami akan menggunakan JsonLab, kotak alat untuk pengekodan/penyahkodan fail JSON di MATLAB. Aplikasi web akan dibuat menggunakan stack min. Jika anda tidak biasa dengan Mean Stack, disarankan agar anda membaca artikel "pemula stack min" sebelum meneruskan.

Pengenalan kepada JSONLAB

JsonLab adalah pelaksanaan sumber terbuka percuma pengekod/decoder JSON dalam bahasa Matlab. Ia boleh digunakan untuk menukar struktur data MATLAB (tatasusunan, struktur, sel, susunan struktur, dan susunan sel) ke dalam rentetan dalam format JSON, atau untuk menyahkod fail JSON ke dalam data MATLAB.

3 Dua fungsi terakhir digunakan untuk mengendalikan format Ubjson.

digunakan untuk menukar rentetan JSON ke dalam objek MATLAB yang berkaitan. Dalam projek kami, kami hanya menggunakan fungsi loadjson(), yang menukarkan objek MATLAB (sel, struktur, atau array) ke rentetan JSON. Ia boleh digunakan seperti berikut: savejson() loadubjson() saveubjson() Oleh kerana kita perlu menulis fail, kita akan menggunakan tandatangan pertama. Ia mengembalikan rentetan JSON serta menulis rentetan ke fail. loadjson() savejson()

pemasangan jsonLab
json = savejson(rootname, obj, filename)
json = savejson(rootname, obj, opt)
json = savejson(rootname, obj, 'param1', value1, 'param2', value2, ...)
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Untuk memulakan, muat turun jsonlab, unzip arkib, dan tambahkan laluan folder ke senarai laluan MATLAB menggunakan arahan berikut:

Jika anda ingin menambah laluan ini secara kekal, anda perlu menaip

, semak imbas ke folder root JSONLAB dan tambahkannya ke senarai. Setelah selesai, anda mesti klik Simpan. Kemudian, jalankan

dalam MATLAB dan taip

. Jika anda melihat output, ini bermakna JsonLab dipasang dengan betul.
addpath('/path/to/jsonlab');
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

pathtool Matlab Code rehash which loadjson

Kami memerlukan masa semasa, jadi kami akan menggunakan perintah

. Ia mengembalikan vektor tarikh enam elemen yang mengandungi tarikh dan masa semasa dalam format [tahun, bulan, hari, jam, minit, saat]. Untuk mendapatkan masa berulang kali, kami meletakkan perintah dalam gelung tak terhingga. Oleh itu, kami akan terus mendapatkan data masa nyata sehingga pelaksanaan skrip ditamatkan menggunakan Ctrl C pada tetingkap Perintah MATLAB.

Kod berikut melaksanakan idea ini:

clock clock Dalam projek kami, kami memberi tumpuan kepada jam, minit, dan saat. Fungsi while yang digunakan dalam kod di atas pusingan semua elemen matriks ke integer terdekat. Untuk mendapatkan data jam, kami memerlukan nilai lajur 4 matriks, jadi kami menggunakan arahan

. Menggunakan kaedah yang sama, kami mengambil minit dan saat.

kami akan menghantar jam dan beberapa pembolehubah berasingan ke aplikasi web secara berasingan untuk memaparkan penukaran jenis data yang berbeza dari objek MATLAB ke JSON. Walaupun data jam akan ditukar kepada array, nilai jam, minit dan saat akan ditukar kepada nombor, yang akan kita lihat kemudian.
format shortg;
y=0;
while y == 0
    % c = [year month day hour minute seconds]
    c=clock;
    % 将每个值四舍五入为整数
    c=fix(c);
    x.clock=c;
    % 访问c的第4列,即小时
    x.hours=c(:,4);
    % 访问c的第5列,即分钟
    x.minutes=c(:,5);
    % 访问c的第6列,即秒
    x.seconds=c(:,6);
    % 将x转换为JSON并写入matlabData.json
    savejson('',x,'data/matlabData.json');
end
Salin selepas log masuk
Salin selepas log masuk

Dalam projek kami, kami akan menggunakan fungsi fix(c) untuk menukar dan menulis pembolehubah x menggunakan format JSON dan tuliskannya ke fail c(:,4). Untuk kesederhanaan, parameter

akan menjadi rentetan kosong.

Gunakan kod sebelumnya, kami melengkapkan semua kod MATLAB yang diperlukan. Sekarang, sebaik sahaja kita menjalankan skrip, kita dapat melihat bahawa fail JSON dibuat dalam folder data dan data dalam fail akan dikemas kini secara automatik dan sentiasa. Contoh kandungan fail JSON adalah seperti berikut:

savejson() matlabData.json kami akan memantau fail ini dan menggunakan Node.js untuk membaca data terkini. Sekarang mari kita mula membina aplikasi web. rootname

Aplikasi Web

{
   "hours": 19,
   "minutes": 28,
   "seconds": 28,
   "clock": [2015,5,27,19,28,28]
}
Salin selepas log masuk
Salin selepas log masuk

Sekarang data MATLAB kami telah ditukar kepada JSON dan disimpan dalam fail, kami dapat membaca fail ini secara bebas dan mendapatkan data dengan memantau perubahannya. Operasi ini tidak ada kaitan dengan MATLAB. Di seluruh artikel ini, saya akan menganggap anda memahami Socket.io dan tumpukan min, walaupun kita hanya menggunakan beberapa konsep asas mereka.

mari mula menulis aplikasi web.

Buat fail Package.json

Untuk memulakan permohonan kami, mari kita tentukan kebergantungan projek. Untuk melakukan ini, kami akan membuat fail package.json seperti berikut:

json = savejson(rootname, obj, filename)
json = savejson(rootname, obj, opt)
json = savejson(rootname, obj, 'param1', value1, 'param2', value2, ...)
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Selepas membuat fail, jalankan

dalam folder root projek untuk memasang semua kebergantungan. Jika anda tidak biasa dengan NPM, disarankan agar anda membaca "NPM Bermula Panduan - Pengurus Pakej Node". npm install

kod sampingan pelayan Bahagian kod ini melibatkan penggunaan Node.js, Express, dan MongoDB. Operasi yang dilakukan oleh pelayan termasuk:

disediakan
    fail
  • index.html memantau dan membaca data dalam fail json
  • simpan data ke pangkalan data menggunakan mongoDB
  • Hantar data ke penyemak imbas menggunakan socket.io
  • kami akan membuat fail bernama
dalam folder root di mana kami akan menulis kod yang diperlukan untuk semua fungsi yang diterangkan.

server.js Kami menggunakan Express untuk menyediakan fail statik:

Setiap kali permintaan dihantar ke
addpath('/path/to/jsonlab');
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
, fail

yang disimpan dalam direktori / akan disediakan. app index.html Untuk memantau sebarang perubahan pada fail, kami menggunakan

, dan membaca fail setiap kali ia berubah, kami menggunakan

. Sebaik sahaja perubahan dikesan, fail dibaca dan data diambil. Keseluruhan proses selesai menggunakan kod berikut: fs.watch() fs.readFile()

Apabila sambungan ditubuhkan dengan pelanggan dan mula mengambil data, kami akan melakukan dua perkara:
format shortg;
y=0;
while y == 0
    % c = [year month day hour minute seconds]
    c=clock;
    % 将每个值四舍五入为整数
    c=fix(c);
    x.clock=c;
    % 访问c的第4列,即小时
    x.hours=c(:,4);
    % 访问c的第5列,即分钟
    x.minutes=c(:,5);
    % 访问c的第6列,即秒
    x.seconds=c(:,6);
    % 将x转换为JSON并写入matlabData.json
    savejson('',x,'data/matlabData.json');
end
Salin selepas log masuk
Salin selepas log masuk

Hantar data ke penyemak imbas menggunakan fungsi Socket.io's
  1. emit() simpan data ke mongoDB menggunakan middware mongoose
  2. Untuk melaksanakan operasi kedua, kami membuat skema data dan kemudian membuat model berdasarkan skema itu. Ini dilakukan menggunakan kod yang ditunjukkan di bawah:

Dalam pernyataan terakhir segmen kod terdahulu, kami membuat model berdasarkan corak yang ditetapkan. Parameter pertama yang diserahkan kepada fungsi adalah nama tunggal set yang dimiliki oleh model kami. Mongoose secara automatik menyerahkan nama jamak ke koleksi. Oleh itu, di sini
{
   "hours": 19,
   "minutes": 28,
   "seconds": 28,
   "clock": [2015,5,27,19,28,28]
}
Salin selepas log masuk
Salin selepas log masuk
adalah model koleksi

. appData appDatas Apabila kami mendapat data baru, kami akan menggunakan data terkini untuk membuat contoh baru skema dan simpannya ke pangkalan data menggunakan kaedah

. Contoh ini dipanggil dokumen. Dalam kod berikut,

adalah dokumen. save() savingData Kod akhir untuk bahagian ini adalah seperti berikut:

json = savejson(rootname, obj, filename)
json = savejson(rootname, obj, opt)
json = savejson(rootname, obj, 'param1', value1, 'param2', value2, ...)
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Kami menggunakan try dan catch untuk mengelakkan permohonan daripada terhempas. Jika kita tidak menggunakannya, dan JSON.parse menyebabkan kesilapan input pengguna yang tidak dijangka disebabkan oleh perubahan pesat, permohonan itu mungkin terhempas. Inilah yang ingin kita elakkan!

Juga ambil perhatian bahawa sila pastikan pelayan MongoDB sedang berjalan, jika tidak, aplikasi itu akan terhempas.

kod klien

Dalam bahagian ini, kami akan membuat halaman HTML statik yang mudah. Apabila data baru diterima melalui Socket.io, kami akan mengemas kini data yang dipaparkan pada halaman. Data ini juga boleh digunakan untuk membuat carta masa nyata.

Berikut adalah kod mudah untuk fail index.html:

addpath('/path/to/jsonlab');
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Arahan

ngCloak digunakan untuk menghalang penyemak imbas dari secara ringkas memaparkan bentuk asal (tidak dikompilasi) template angularjs apabila aplikasi dimuatkan.

Jalankan aplikasi

Sebelum memulakan pelayan Node.js, kita perlu memastikan bahawa kod MATLAB dan pelayan MongoDB sedang berjalan. Untuk menjalankan pelayan MongoDB, anda perlu melaksanakan arahan mongod di terminal. Untuk menjalankan pelayan Node.js, anda mesti melaksanakan arahan node server.js dalam direktori root folder projek.

Halaman statik yang menunjukkan masa semasa akan disediakan dalam 127.0.0.1:3000.

Kesimpulan

Dalam artikel ini, kami menggunakan stack min untuk membuat aplikasi web yang mendapat data dalam format JSON dari program MATLAB. Data ditukar dengan bantuan JSONLAB. Data kemudiannya dihantar ke penyemak imbas menggunakan socket.io, jadi perubahan pada penyemak imbas dicerminkan dalam masa nyata. Kod sumber penuh untuk demo ini boleh didapati di GitHub.

Saya harap anda menikmati artikel ini dan berharap dapat membaca komen anda.

(bahagian Soalan Lazim disyorkan untuk mengendalikannya secara berasingan kerana panjang artikel. Soalan dan jawapan utama boleh diekstrak dan diringkaskan secara ringkas atau disusun semula seperti yang diperlukan.)

Atas ialah kandungan terperinci Membuat aplikasi Web dengan MATLAB dan Mean Stack. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

Video Face Swap

Video Face Swap

Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!

Alat panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Topik panas

Tutorial Java
1664
14
Tutorial PHP
1266
29
Tutorial C#
1239
24
Demystifying JavaScript: Apa yang berlaku dan mengapa penting Demystifying JavaScript: Apa yang berlaku dan mengapa penting Apr 09, 2025 am 12:07 AM

JavaScript adalah asas kepada pembangunan web moden, dan fungsi utamanya termasuk pengaturcaraan yang didorong oleh peristiwa, penjanaan kandungan dinamik dan pengaturcaraan tak segerak. 1) Pengaturcaraan yang didorong oleh peristiwa membolehkan laman web berubah secara dinamik mengikut operasi pengguna. 2) Penjanaan kandungan dinamik membolehkan kandungan halaman diselaraskan mengikut syarat. 3) Pengaturcaraan Asynchronous memastikan bahawa antara muka pengguna tidak disekat. JavaScript digunakan secara meluas dalam interaksi web, aplikasi satu halaman dan pembangunan sisi pelayan, sangat meningkatkan fleksibiliti pengalaman pengguna dan pembangunan silang platform.

Evolusi JavaScript: Trend Semasa dan Prospek Masa Depan Evolusi JavaScript: Trend Semasa dan Prospek Masa Depan Apr 10, 2025 am 09:33 AM

Trend terkini dalam JavaScript termasuk kebangkitan TypeScript, populariti kerangka dan perpustakaan moden, dan penerapan webassembly. Prospek masa depan meliputi sistem jenis yang lebih berkuasa, pembangunan JavaScript, pengembangan kecerdasan buatan dan pembelajaran mesin, dan potensi pengkomputeran IoT dan kelebihan.

Enjin JavaScript: Membandingkan Pelaksanaan Enjin JavaScript: Membandingkan Pelaksanaan Apr 13, 2025 am 12:05 AM

Enjin JavaScript yang berbeza mempunyai kesan yang berbeza apabila menguraikan dan melaksanakan kod JavaScript, kerana prinsip pelaksanaan dan strategi pengoptimuman setiap enjin berbeza. 1. Analisis leksikal: Menukar kod sumber ke dalam unit leksikal. 2. Analisis Tatabahasa: Menjana pokok sintaks abstrak. 3. Pengoptimuman dan Penyusunan: Menjana kod mesin melalui pengkompil JIT. 4. Jalankan: Jalankan kod mesin. Enjin V8 mengoptimumkan melalui kompilasi segera dan kelas tersembunyi, Spidermonkey menggunakan sistem kesimpulan jenis, menghasilkan prestasi prestasi yang berbeza pada kod yang sama.

Python vs JavaScript: Keluk Pembelajaran dan Kemudahan Penggunaan Python vs JavaScript: Keluk Pembelajaran dan Kemudahan Penggunaan Apr 16, 2025 am 12:12 AM

Python lebih sesuai untuk pemula, dengan lengkung pembelajaran yang lancar dan sintaks ringkas; JavaScript sesuai untuk pembangunan front-end, dengan lengkung pembelajaran yang curam dan sintaks yang fleksibel. 1. Sintaks Python adalah intuitif dan sesuai untuk sains data dan pembangunan back-end. 2. JavaScript adalah fleksibel dan digunakan secara meluas dalam pengaturcaraan depan dan pelayan.

JavaScript: meneroka serba boleh bahasa web JavaScript: meneroka serba boleh bahasa web Apr 11, 2025 am 12:01 AM

JavaScript adalah bahasa utama pembangunan web moden dan digunakan secara meluas untuk kepelbagaian dan fleksibiliti. 1) Pembangunan front-end: Membina laman web dinamik dan aplikasi satu halaman melalui operasi DOM dan kerangka moden (seperti React, Vue.js, sudut). 2) Pembangunan sisi pelayan: Node.js menggunakan model I/O yang tidak menyekat untuk mengendalikan aplikasi konkurensi tinggi dan masa nyata. 3) Pembangunan aplikasi mudah alih dan desktop: Pembangunan silang platform direalisasikan melalui reaktnatif dan elektron untuk meningkatkan kecekapan pembangunan.

Cara Membina Aplikasi SaaS Multi-Tenant dengan Next.js (Integrasi Frontend) Cara Membina Aplikasi SaaS Multi-Tenant dengan Next.js (Integrasi Frontend) Apr 11, 2025 am 08:22 AM

Artikel ini menunjukkan integrasi frontend dengan backend yang dijamin oleh permit, membina aplikasi edtech SaaS yang berfungsi menggunakan Next.Js. Frontend mengambil kebenaran pengguna untuk mengawal penglihatan UI dan memastikan permintaan API mematuhi dasar peranan

Membina aplikasi SaaS Multi-penyewa dengan Next.js (Integrasi Backend) Membina aplikasi SaaS Multi-penyewa dengan Next.js (Integrasi Backend) Apr 11, 2025 am 08:23 AM

Saya membina aplikasi SaaS multi-penyewa berfungsi (aplikasi edTech) dengan alat teknologi harian anda dan anda boleh melakukan perkara yang sama. Pertama, apakah aplikasi SaaS multi-penyewa? Aplikasi SaaS Multi-penyewa membolehkan anda melayani beberapa pelanggan dari Sing

Dari C/C ke JavaScript: Bagaimana semuanya berfungsi Dari C/C ke JavaScript: Bagaimana semuanya berfungsi Apr 14, 2025 am 12:05 AM

Peralihan dari C/C ke JavaScript memerlukan menyesuaikan diri dengan menaip dinamik, pengumpulan sampah dan pengaturcaraan asynchronous. 1) C/C adalah bahasa yang ditaip secara statik yang memerlukan pengurusan memori manual, manakala JavaScript ditaip secara dinamik dan pengumpulan sampah diproses secara automatik. 2) C/C perlu dikumpulkan ke dalam kod mesin, manakala JavaScript adalah bahasa yang ditafsirkan. 3) JavaScript memperkenalkan konsep seperti penutupan, rantaian prototaip dan janji, yang meningkatkan keupayaan pengaturcaraan fleksibiliti dan asynchronous.

See all articles