BullGuard Antivirus Sale - 60% Off with openElement !
Forum Home Forum Home >

openElement

> openElement General Discussion
  New Posts New Posts RSS Feed - Need Guidance on Deploying Diagram as Code-Control
  FAQ FAQ  Forum Search   Register Register  Login Login

Need Guidance on Deploying Diagram as Code-Control

 Post Reply Post Reply
Author
Message
MNCTYLDN View Drop Down
Newbie
Newbie
Avatar

Joined: May 12 2022
Status: Offline
Points: 3
Post Options Post Options   Thanks (0) Thanks(0)   Quote MNCTYLDN Quote  Post ReplyReply Direct Link To This Post Topic: Need Guidance on Deploying Diagram as Code-Control
    Posted: May 12 2022 at 3:54pm
Introduction: 

Hi, everyone, Lilian here. 
   I've been out of the coding and HTML game for far too long, and I'm definitely not remembering how to do some stuff I could have sworn I was able to. I put myself in over my head with rusty skills that have definitely been set aside during other work.

TLDR: 
I need to port each element into a website and make those elements code-responsive, and I have no idea how to anymore.

Further Detail:
Let me boil my objective down to its core components:

1.)  I have a biology diagram that I have crafted in draw.io (started on the web app, then continued on the desktop deployment).

2.)  In the diagram, I assigned different elements of different pathways to different layers

3.)  My objective is a responsive diagram that can be customized based on what parts of the pathways a user would like to focus on.

4.)  The pathways both converge and diverge, so turning on and off individual layers gets burdensome. See example: Each item on the membrane is in its own layer, each molecule above it is in its own layer, and each downstream effect is in its own layer.

5.)  On a code-powered website deployment, I believe I can remember how to put together  ON/OFF checkboxes for users to influence variables (IF box_y checked, var_y=true), and coding statements for each separate element to be displayed based on each individual box (IF {x, OR y, OR z}==true, display element_z). 

6.)  I have NO idea anymore how to work with either raw HTML/CSS or with modern website-building software like openElement, and especially have no idea how to move my existing draw.io work into openElement as intact, separated elements I can toggle.

Please help me carve the rust off--I'm willing to work at it to achieve my goal. 

Sincerely asking for help,
--Lilian



Back to Top
Hobby001 View Drop Down
Admin Group
Admin Group
Avatar

Joined: Jun 05 2018
Location: Canada, Québec
Status: Offline
Points: 5866
Post Options Post Options   Thanks (0) Thanks(0)   Quote Hobby001 Quote  Post ReplyReply Direct Link To This Post Posted: May 13 2022 at 1:26am
If I am correct, you can export to html directly form draw.io

If you create a page with openElement, you may use a visual code block to include the code from draw.io export.

Making it responsive will depend on your patience and programming skills

You will need to develop html/css knowledge in order to achieve you goal.

Meanwhile, here is a note that I intend to send to new forum users:


Welcome to the openElement Forum

To acquire better openElement knowledge, my suggestion is  that you spend some time looking at the video tutorial on this YouTube playlist.

In addition, there are other videos on this other YouTube playlist

You will find several user tutorial here

In addition to the models available from openElement’s library you may have a look to those offered by Sensode

In addition to OE’s standard elements, some additional user designed elements are available here

 

P.S.

It is important that you understand that all help provided here is given by volunteers.

We are not openElement’s staff.

We are happy to help when we are available to provide tips, tricks, and sometimes a few code lines. We appreciate that users make a serious research and self-study effort.

Some of us work in Europe, others around the world. Consequently, the response time may also depend on time zones.

When the requirement is too great, it can be contracted and the required retribution will pay for the development.

 

Always take care to open a new subject for each of your questions

 


Back to Top
Hobby001 View Drop Down
Admin Group
Admin Group
Avatar

Joined: Jun 05 2018
Location: Canada, Québec
Status: Offline
Points: 5866
Post Options Post Options   Thanks (0) Thanks(0)   Quote Hobby001 Quote  Post ReplyReply Direct Link To This Post Posted: May 13 2022 at 1:32am
You can't paste an image into a post.

You have to make it available somewhere on the net and paste the code to display it here.

The link to this image will look like:  

Back to Top
Hobby001 View Drop Down
Admin Group
Admin Group
Avatar

Joined: Jun 05 2018
Location: Canada, Québec
Status: Offline
Points: 5866
Post Options Post Options   Thanks (0) Thanks(0)   Quote Hobby001 Quote  Post ReplyReply Direct Link To This Post Posted: May 13 2022 at 1:36am
If you are planning to make several diagrams available you may pay someone to build some standard page that you will be able to copy and use for each diagram.
Back to Top
Hobby001 View Drop Down
Admin Group
Admin Group
Avatar

Joined: Jun 05 2018
Location: Canada, Québec
Status: Offline
Points: 5866
Post Options Post Options   Thanks (1) Thanks(1)   Quote Hobby001 Quote  Post ReplyReply Direct Link To This Post Posted: May 13 2022 at 1:43am
To develop new programming skills take a look at https://www.w3schools.com/

Back to Top
MNCTYLDN View Drop Down
Newbie
Newbie
Avatar

Joined: May 12 2022
Status: Offline
Points: 3
Post Options Post Options   Thanks (0) Thanks(0)   Quote MNCTYLDN Quote  Post ReplyReply Direct Link To This Post Posted: May 16 2022 at 2:18pm
Thank you very much for all the assistance! I will continue to work with it until it reaches the state I need it to be in.

I am currently experimenting with draw.io's html export. If the export does not meet my needs, I may need to recreate it from scratch html-native. In this context, what kind of element responds most easily to hide/show conditionals? I would be crafting it similar to the image I originally attempted to post as example, shown below.

Back to Top
Hobby001 View Drop Down
Admin Group
Admin Group
Avatar

Joined: Jun 05 2018
Location: Canada, Québec
Status: Offline
Points: 5866
Post Options Post Options   Thanks (0) Thanks(0)   Quote Hobby001 Quote  Post ReplyReply Direct Link To This Post Posted: May 16 2022 at 9:37pm
If I understand your goal, you wish to replace values displayed on the extract from draw.io.

Is it ok to say it?

If yes, paste the html code in an additional post to this topic.

If you are not comfortable with this idea, paste it into a message from thie forum's private messaging system.
Back to Top
 Post Reply Post Reply
  Share Topic   

Forum Jump Forum Permissions View Drop Down

Forum Software by Web Wiz Forums® version 12.04
Copyright ©2001-2021 Web Wiz Ltd.

This page was generated in 0.062 seconds.