How to add a feature to GO JS floorplanner sample? - javascript

I'm currently building a GO JS floor planner based on this sample (https://gojs.net/latest/projects/floorplanner/FloorPlanner.html). When the user places walls and they connect to each other, I want to make a room out of the four walls. I want to fill out the area that was shaped by the 4 walls. I know this is in the second-floor planner but I just want to add this feature to the old one and I don't know TypeScript. Can someone help me, how should I do it?

Related

Changing image colors and adding layers?

First thank you for reading and in advanced for answering.
I am in the process of creating a message board based canine role-playing game. I'm researching and practicing and creating first drafts. So far I have everything I need for the map, forum, front end. I'm using html, css, js, and php. I have hosting with a database and I've been able to successfully create a database, call and input data.
So the part I'm stuck with trying to learn is the character creation page. I want users to be able to customize an image of a canine I've drawn by choosing a base coat color, eye color, and skin color from a drop down each and then that reflect on the image. Then to be able to further make the canine unique by adding markings. I've explored SVGs and it's just not what I want to do, unless it's the only way? But I still don't understand how to make the dropdown and adding/changing opacity of layer (marking) reflect on the image and save as a new image to the website.
So in short, can someone point me in the direction or show me a small example on how to make dropdowns and adding layers to reflect on an image? I really really hope this makes sense!

How to create a dynamic graph for websites?

Hello,
I'm relatively new to the programming world and I was wondering how I would go about creating the following for a website I'm designing. I will use a random example as to not give my application away, but the process should be the same. I apologize ahead of time for the unrealistic values:
Say a civil engineer wants to come onto my website and figure out the mechanical stress at certain points on the Eiffel tower, lets say on the corner of the first/second observation deck (see Image). To make this more general, they want to vary values such as the height and base width of the tower to see how that affects the mechanical stress at those points.
Now, I can make the algorithm for calculating those stress values. My question is, how would a programmer go about creating this dynamic figure, such that the 'stress values' are shown on the image at distinct locations, and they change based off of the values of the user inputs + algorithm? My thoughts are the following:
Use HTML/CSS to place the images and design the webpage
Use JavaScript to take inputs, run the algorithm and calculate outputs. This would also make the dynamic changes on the image.
I have zero experience with JavaScript (I'm okay with HTML/CSS as I have built my own website before). I guess I'm hoping to be pointed in the right direction before I go off and start learning the wrong language for this application.
Bonus Challenge
While they're doing this, it would be nice to see a visual representation of the Eiffel tower change when the height and base area are changed. ie if you make the base way wider and the height much shorter, the bending in the midsection is going to be much more apparent. Obviously, this means I wouldn't be using a picture, but actually a vector-image model of the Eiffel tower that would change based off of the inputs. So what language and what libraries would one use to go about making this sort of things?
Thank you to anyone that can provide some insight on my issue. I really appreciate it!
Mike
Hello to integrate dynamic graph in a webpage there are two ways;
First you need to make your own graph library. For that you need to know SVG well to make a good looking graph.
Second, you can use any existing library. There are lot of open source libraries are there some of them are free to use also. To integrate graph using those libraries is not much difficult.
Some examples of graph generating library morris chart, c3.js etc. Google search 'll give you more detail idea.
As you said you have no idea about javascript so it will be a bit difficult at first for integrating graph. But 'll definitely much more easy to make your own graph library.

How do I create an object such as a wall in javascript?

I am programming a game in JavaScript, the game involves player one controlling an image of a head around the screen by using the arrows on the keyboard. The aim is to get as much burgers shown on the screen. Once you get it, it will randomly appear somewhere else on the screen. My first problem is how do i create an obstacle such as a wall in JavaScript? my second problem is how do i create a rule that result's in game over if the obstacle is touched?
It is easy to solve by using box2D, and I use the framework which integrates box2D.
this is the example link I did 2 mins ago:game link
if you don't know how to use it,my facebook messenger is Alan Nie

How to draw below dynamic & interactive chart

Below is the industrial plan of a warehouse with all machines and sections there in the ware house . I need to draw an interactive plan as below and all the sections are clickable . For eg: in below image there is a section godown I need to make it clickable so that when user clicks it he/she can see details i.e. it takes to another page of or so. Can anyone let me know if there are any framework that can let me draw a dynamic and interactive plan such as above.All data are from database.
Due to you asking for recommendations, you're only going to get biased answers, but here goes anyway:
I'd personally suggest the powerful D3JS, as it has a lot of examples, a helpful community and most (if not all) features you are looking for.

How to create hollow geometries with holes in Three.js (without CSG.js?)

I'd like to create a hollow box with some holes in Three.js.
Currently I managed to create a hollow box by creating a regular geometry and pushing triangles by hand (I created the inner box and than the outer box and merged the two together).
What I would like to know is if there's a simper solution that would also allow me to create holes in the cube.
Now, I've done some research on this question and found out about CSG.js. While this library looks like it would be a perfect fit for my needs, I'm not so comfortable with incorporating it into my codebase as it wasn't updated in more than 4 years (last commit was done on the 20th of August, 2012.
So my question is - is there a (practical) way to achieve what I want without using CSG.js?
Also, if you have any way to address my concerns about CSG.js I would appreciate it very much.
P.S.: I would like to be able to control the shape of the hole as well - but for simplicity sake let's say I'm talking about diamond-shaped (Rhombus) holes.

Categories