AMcoder - javascript, python, java, html, php, sql

CytoscapeJS React-ում. գործարկել դասավորությունը

Ես ունեմ cytoscape in react, օգտագործելով plotly-ի cytoscape-ը react-ի համար, այստեղ:

Ես կատարել եմ հետևյալ քայլերը.

// import and register the layouts
import Cytoscape from 'cytoscape';  
import COSEBilkent from 'cytoscape-cose-bilkent'; 

Cytoscape.use(COSEBilkent);  

Եվ ես ներկայացնում եմ իմ գրաֆիկը բաղադրիչի ներսում (տարրերը ճիշտ ձևավորված են).

render() {
...
let elements = ...
const layout = {name:'cose-bilkent'}; 
...
<Cytoscape
elements={elements} 
style={{width:'1635px',height:'1114px'}} 
layout={layout}
/>

Եվ այնուամենայնիվ, հանգույցները պահպանում են իրենց լռելյայն դիրքերը մատուցման ժամանակ: Ես դեռ շատ ժամանակ չեմ ունեցել react-ի հետ աշխատելու համար։ Կա՞ որևէ պարզ քայլ, որը ես բացակայում եմ, որպեսզի այս գրաֆիկը ներկայացվի դասավորությամբ:


Պատասխանները:


1

Դուք պետք է ներմուծեք մեկ այլ գրադարան: Այնպիսին է, որ:

// import and register the layouts
import Cytoscape from "cytoscape";
import CytoscapeComponent from "react-cytoscapejs";
import COSEBilkent from "cytoscape-cose-bilkent";

Cytoscape.use(COSEBilkent);

Եվ հետո զանգահարեք React բաղադրիչը.

<CytoscapeComponent /> instead of <Cytoscape /> as you have done.
21.11.2019
Նոր նյութեր

Օգտագործելով Fetch Vs Axios.Js-ը՝ HTTP հարցումներ կատարելու համար
JavaScript-ը կարող է ցանցային հարցումներ ուղարկել սերվեր և բեռնել նոր տեղեկատվություն, երբ դա անհրաժեշտ լինի: Օրինակ, մենք կարող ենք օգտագործել ցանցային հարցումը պատվեր ներկայացնելու,..

Տիրապետել հանգստության արվեստին. մշակողի ուղեցույց՝ ճնշման տակ ծաղկելու համար
Տիրապետել հանգստության արվեստին. մշակողի ուղեցույց՝ ճնշման տակ ծաղկելու համար Ինչպե՞ս հանգստացնել ձեր միտքը և աշխատեցնել ձեր պրոցեսորը: Ինչպես մնալ հանգիստ և զարգանալ ճնշման տակ...

Մեքենայի ուսուցում բանկային և ֆինանսների ոլորտում
Բարդ, խելացի անվտանգության համակարգերը և հաճախորդների սպասարկման պարզեցված ծառայությունները բիզնեսի հաջողության բանալին են: Ֆինանսական հաստատությունները, մասնավորապես, պետք է առաջ մնան կորի..

Ես AI-ին հարցրի կյանքի իմաստը, այն ինչ ասում էր, ցնցող էր:
Այն պահից ի վեր, երբ ես իմացա Արհեստական ​​ինտելեկտի մասին, ես հիացած էի այն բանով, թե ինչպես է այն կարողանում հասկանալ մարդկային նորմալ տեքստը, և այն կարող է առաջացնել իր սեփական արձագանքը դրա..

Ինչպես սովորել կոդավորումը Python-ում վագրի պես:
Սովորելու համար ծրագրավորման նոր լեզու ընտրելը բարդ է: Անկախ նրանից, թե դուք սկսնակ եք, թե առաջադեմ, դա օգնում է իմանալ, թե ինչ թեմաներ պետք է սովորել: Ծրագրավորման լեզվի հիմունքները, դրա..

C++-ի օրական բիթ(ե) | Ամենաերկար պալինդրոմային ենթաշարը
C++ #198-ի ամենօրյա բիթ(ե), Ընդհանուր հարցազրույցի խնդիր. Ամենաերկար պալինդրոմային ենթատող: Այսօր մենք կանդրադառնանք հարցազրույցի ընդհանուր խնդրին. Ամենաերկար palindromic substring...

Kydavra ICAReducer՝ ձեր տվյալների ծավալայինությունը նվազեցնելու համար
Ի՞նչ է ICAReducer-ը: ICAReducer-ն աշխատում է հետևյալ կերպ. այն նվազեցնում է նրանց միջև բարձր փոխկապակցված հատկանիշները մինչև մեկ սյունակ: Բավականին նման է PCAreducer-ին, չնայած այն..