Need Guidance on Deploying Diagram as Code-Control |
Post Reply |
Author | |
MNCTYLDN
Newbie Joined: May 12 2022 Status: Offline Points: 3 |
Post Options
Thanks(0)
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 |
|
Hobby001
Admin Group Joined: Jun 05 2018 Location: Canada, Québec Status: Offline Points: 6195 |
Post Options
Thanks(0)
|
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 |
|
Hobby001
Admin Group Joined: Jun 05 2018 Location: Canada, Québec Status: Offline Points: 6195 |
Post Options
Thanks(0)
|
Hobby001
Admin Group Joined: Jun 05 2018 Location: Canada, Québec Status: Offline Points: 6195 |
Post Options
Thanks(0)
|
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.
|
|
Hobby001
Admin Group Joined: Jun 05 2018 Location: Canada, Québec Status: Offline Points: 6195 |
Post Options
Thanks(1)
|
To develop new programming skills take a look at https://www.w3schools.com/
|
|
MNCTYLDN
Newbie Joined: May 12 2022 Status: Offline Points: 3 |
Post Options
Thanks(0)
|
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. |
|
Hobby001
Admin Group Joined: Jun 05 2018 Location: Canada, Québec Status: Offline Points: 6195 |
Post Options
Thanks(0)
|
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.
|
|
Post Reply | |
Tweet
|
Forum Jump | Forum Permissions You cannot post new topics in this forum You cannot reply to topics in this forum You cannot delete your posts in this forum You cannot edit your posts in this forum You cannot create polls in this forum You cannot vote in polls in this forum |