Webpage with formulas and graphics

Can anybody tell me what will be the recommended toll/software for a beginner to design a webpage which contains input boxes for numbers, tables which will be populated as result of calculations with complicated algebraic formulas and real time graphics as for example similar as in the next webpages?:
https://www.mathsisfun.com/algebra/quadratic-equation-graph.html
http://www.freemathhelp.com/equation-grapher.html
In my situation the curve on the graphic is already known, on logarithm scale,  and 2 cursors, one vertical and one horizontal which have to move along the curve from graphic after result of calculation.
I was thinking that maybe Adobe Dreamweaver can do the job.

Do you have any other suggestions, maybe simpler? Adobe Muse seems too simple, or?
If I hire a web page designer, how long time is estimated for such page to be done? And how much would that cost?

P.S. I have done an VBA application in Excel to do the job and now I would like to make it as webpage.
LVL 21
viki2000Asked:
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

aburrCommented:
Will not excell save the excell page as an html file?
0
viki2000Author Commented:
It is not a simple Excel Sheet. It is a UserForm in VBA which contains all kind of Controls with enough code behind.
0
Bob LearnedCommented:
If you have a text editor, and some knowledge of JavaScript, then you could create some HTML pages, with script libraries, like Morris.js to do the charting.

http://morrisjs.github.io/morris.js/ 

You would need to convert the equations to Javascript functions, or there might be a library out in the world already.
0
Determine the Perfect Price for Your IT Services

Do you wonder if your IT business is truly profitable or if you should raise your prices? Learn how to calculate your overhead burden with our free interactive tool and use it to determine the right price for your IT services. Download your free eBook now!

Scott Fell, EE MVEDeveloper & EE ModeratorCommented:
The items you mentioned in your question would be fine if your graph was an image but your asking for user input and dynamically changing the content.  

The web page for this could be simple
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>My Web Page</title>
  <script>
    // javascript will go here and update div#results
  </script>
</head>
<body>
<div id="container">
<form>
    <input name="param1" id="param1" placeholder="parameter 1">
 <input name="param2" id="param2" placeholder="parameter 2">
<button>submit</button>
</form>
  <h2>My Data</h2>
  <div id="results"></div>
</div>
</body>
</html>

Open in new window


Now, what goes in between the script tags to update the div#results is where there is complexity.  It will be a matter of translating your formulas to javascript.   As Bob pointed out, there are libraries that can make this process easier.  

Rob Jurd has written a nice tut on using chart.js http://www.experts-exchange.com/articles/18399/Chart-js-An-Introduction.html.  Chartjs is a nice open source library for making charts and graphs in javascript http://www.chartjs.org/
0
viki2000Author Commented:
@Scott Fell
"The items you mentioned in your question would be fine if your graph was an image but you are asking for user input and dynamically changing the content."

The graph is actually an image, a curve drawn already as a picture.
But in the same time I have a set of equations which can generate that graph with a good acceptable precision. I need these equations because I want a point (defined by (x,y) values, where y=f(x)) moving on the graph based on user input. In fact I want two lines, one vertical and one horizontal, as 2 cursors, and at their intersection to have that point. Then all these 3 items: the horizontal line, the vertical one and the point will move every time the user provides a different x input value.
I do not need to generate a different graph always when the user gives a different input. The line/curve of the graph stays the same, only the above items will move.
Considering the above described behavior details, would be then a simpler situation?

@ Bob Learned (TheLearnedOne)
“You would need to convert the equations to Javascript functions, or there might be a library out in the world already”

Considering the explanation above, do you still consider I need Javascript and to convert the equations to Javascript functions?
My equations are polynomial equations and exponential equations with enough terms and high exponents. I do not remember thenm exactly now, because I found them 2 years ago with regression methods, but next week Monday I could provide the Excel with VBA and the equations – just to have a look and a better opinion what is needed in order to translate it into a web page.
Would that be helpful?

What about:
" If I hire a web page designer, how long time is estimated for such page to be done? And how much would that cost?"
0
Scott Fell, EE MVEDeveloper & EE ModeratorCommented:

1.

>The graph is actually an image

2.

>I have a set of equations which can generate that graph with a good acceptable precision.

3.

>Then all these 3 items: the horizontal line, the vertical one and the point will move every time the user provides a different x input value.

4.

>If I hire a web page designer, how long time is estimated for such page to be done? And how much would that cost?"
The first point you make contradicts the third.  Typically this will all be done client side using javascript.  The sample page you pointed to is done using flash and it visually may seem like an image, but it is an embed swf file.  Today for modern browsers/mobile, you will do this in javascript.

I suppose there could be a way to do this server side but where the graph is generated as an image, the image saved to the server then sent to the browser.  It would be hog up resources.   You could have your formulas server side and just send values to the browser for javascript to generate the graph, but that will be slower than pure client side and faster than/less resources then pure server side.

What you are really describing is to do this in javascript as we have already mentioned.

As to the last point, how much time it will take will depend on the exact specs you give and how closely a ready made graph sample can be found and if you like the sample.  To create the graph with inputs and discriminate your formula could be several hours on the low end but don't be surprised if it ends up taking several days. The more specs you can give the person working on this as to what you want, the better that can be estimated.   You will find people charge anywhere from free to to $200+ per hour.  Many times "free" is very expensive though :).    You also have to figure in any other types of design elements you want on the page.   I would say if you budgeted $500 for a basic page that has inputs that update a the graph from a preselected sample graph you should be good.  Happy when it is less and will not sting so much if it is a bit more.
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Bob LearnedCommented:
There are many approaches to a solution, so my suggestion of writing the equations in JavaScript was only one possible approach.  We would need to know what you are comfortable with, what you have available, or what you are willing to experiment with, and that is a pretty broad subject.
0
viki2000Author Commented:
OK, fair enough.
Monday I will upload here the Excel file with VBA UserForm.
0
viki2000Author Commented:
"The first point you make contradicts the third."
Actually not. In my VBA case, I use both: static image and the curve. I move my cursors on image knowing the equations and user input data.

Here is my Exel VBA file made in 2013 and unfinished, but main function are working.
I would like to make something similar on a web page.
What do you think? How difficult would be to make such web page?
VBA-to-Webpage.xls
0
Scott Fell, EE MVEDeveloper & EE ModeratorCommented:
Using chartjs as one example http://www.chartjs.org/docs/#line-chart-introduction you simply enter the points in an array and as you mouse over the points you can see the x, y coordinates.  flot does the same http://www.flotcharts.org/flot/examples/interacting/index.html
0
viki2000Author Commented:
Using Chartjs or FlotCharts would be possible to have logarithmic axes as in my VBA file?
Looking at the VBA form from my .xls file, could you estimate how long time would take for an experienced Javascript programmer to make the webpage with the same functionality as in VBA file?
0
Scott Fell, EE MVEDeveloper & EE ModeratorCommented:
Since this is going on the web, you would use javascript in place of vba.  If you look at the samples, they do exactly what you want to do.
0
viki2000Author Commented:
I take that as a "yes", meaning I can have  logarithmic axes.

I would like to close the question now, but I need the last answer.
How long time would take for an experienced Javascript programmer to make the webpage with the same functionality as in VBA file? Can one of you two experts answer this question?
0
Scott Fell, EE MVEDeveloper & EE ModeratorCommented:
I thought I answered the question about time here http:/Q_28671624.html#a40776768
0
viki2000Author Commented:
You said: "To create the graph with inputs and discriminate your formula could be several hours on the low end but don't be surprised if it ends up taking several days"
That is too wide.
Now, after you have seen the VBA file, I expected to narrow the results, because you also mentioned "The more specs you can give the person working on this as to what you want, the better that can be estimated."
I do not have more data than you see in the attached file.
Well, any chance for a better estimation?
0
Scott Fell, EE MVEDeveloper & EE ModeratorCommented:
Setting up a web page goes beyond just converting your vba.  Because I use a Mac, my Excel will not open the vba you have.  But I assume it is simply finding the x,y coordinates of the cursor or even creating the graph.  As pointed out, that is what any of the js libraries are doing.

It is a lot easier to estimate a large project than a small one because there is little room to build in fudge factor.   Several hours is for a simple "white" page using a sampled graph would probably be about the minimum and that is assuming one of the already sampled charts fit what you want.  By the way, to create the graph, you only need to give coordinates, not necessarily the algo.   But in all likelihood, you will want some other page design features and there will need to be modifications to sampled charts and allowing for follow up changes etc could put this to a 10 to 15 hour or more project.
0
viki2000Author Commented:
At least in the last moment you were honest and told me that actually you did not see the content of my VBA. I appreciate that.
If I decide to play with JavaScript and charts to emulate my VBA, then I know definitely I will have more questions, which for sure I will ask, of course as new questions.
Thank you for clarifications. They are helpful to get an idea.
0
Scott Fell, EE MVEDeveloper & EE ModeratorCommented:
Thank you.  

If somebody gave me a project like this and told me the vba is creating a graph and finding points, I would simply ask for the vba as a text file just to  look at but I would only need the algorithm used or a list of coordinates and wouldn't need the vba anyway.

Best of luck in getting this completed.
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
HTML

From novice to tech pro — start learning today.