diff options
| -rw-r--r-- | views/schematic.html | 24 | ||||
| -rw-r--r-- | views/script/form.js | 89 | ||||
| -rw-r--r-- | views/script/gui.js | 6 | ||||
| -rw-r--r-- | views/style/schematic.css | 8 |
4 files changed, 84 insertions, 43 deletions
diff --git a/views/schematic.html b/views/schematic.html index 2669304..c8d7e8d 100644 --- a/views/schematic.html +++ b/views/schematic.html @@ -17,7 +17,7 @@ <script type="text/javascript" src="script/canvg.js"></script> <script type="text/javascript" src="script/rgbcolor.js"></script> <script type="text/javascript" src="script/savenetlist.js"></script> - <script src="script/plotly-latest.min.js"></script> + <script src="script/plotly-latest.min.js"></script> </head><body> @@ -144,10 +144,28 @@ make chips <div id="webtronics_plot_box" class='modal'> - <div id="webtronics_graph_display" > + + <div id="webtronics_plot_area"> + <div id="webtronics_graph_display"></div> + <div id="plot_details"> + <p id="webtronics_plot_keys"></p> + <form id = "get_xy_form"> + <table> + <tr><td> + <input id ="abscissa_submit" type="button" value="Enter Abscissa" > + <input id="abscissa_value" type="text" required> + </td></tr> + <tr> <td> + <input id ="ordinate_submit" type="button" value="Enter Ordinate" > + <input id="ordinate_value" type="text" required> + </td></tr> + </table> + </form> + <input id ="plot_graph" type="button" value="Plot Graph" > + </div> + </div> <img id="webtronics_plot_cancel" class="normal_button" src="buttons/cancel.png"> </div> -</div> diff --git a/views/script/form.js b/views/script/form.js index 11bf6e1..1c9512b 100644 --- a/views/script/form.js +++ b/views/script/form.js @@ -4,51 +4,66 @@ socket.on("plotData",function(data){ var keys = Object.keys(data); var traceObj = {}; var traces = []; - + var abscissa, ordinate; console.log(Object.keys(data)); + $('webtronics_plot_keys').innerHTML = "Available keys: " + Object.keys(data); + //Dynamically creating traces - for(var i=0; i<keys.length; i++){ - if(keys[i]=='x-axis'){ - continue; + jQuery("#plot_graph").click(function(){ + abscissa = $('abscissa_value').value; + ordinate = $('ordinate_value').value; + if(abscissa == "" || ordinate == ""){ + alert("PLease enter values to plot graph"); } else{ - var trace = { - x: data['x-axis'], - y: data[keys[i]], - name:keys[i], - type: 'scatter' - }; - traceObj[keys[i]] = trace; - } - } - - var traceKey = Object.keys(traceObj); - - for (var i=0;i<traceKey.length;i++) { - var value = traceObj[traceKey[i]]; - traces.push(value); - } - - console.log("traces :"+traces); - - var dataForPlotly = traces; + var flag = 0; + for(var i=0; i<keys.length; i++){ + if(keys[i]==ordinate){ + flag=1; + var trace = { + x: data[evalabscissa], + y: data[keys[i]], + name: keys[i], + type: 'scatter' + }; + traceObj[keys[i]] = trace; + } - var layout = { - title:'Simulation Output', - yaxis: { title: "Voltage(Volts) / Current(Amp)"}, // set the y axis title - xaxis: { - title:"time(Sec) / Frequency(Hz)", - showgrid: true // remove the x-axis grid lines - }, - margin: { // update the left, bottom, right, top margin - l: 40, b: 25, r: 10, t: 25 - } - }; + } - Plotly.newPlot(document.getElementById('webtronics_graph_display'), dataForPlotly, layout); - + if(flag == 0){ + alert("Invalid inputs"); + } + else{ + var traceKey = Object.keys(traceObj); + for (var i=0;i<traceKey.length;i++) { + var value = traceObj[traceKey[i]]; + traces.push(value); + } + + console.log("traces :"+traces); + var dataForPlotly = traces; + var layout = { + title:'Simulation Output', + yaxis: { title: "Voltage(Volts) / Current(Amp)"}, // set the y axis title + xaxis: { + title:"time(Sec) / Frequency(Hz)", + showgrid: true // remove the x-axis grid lines + }, + margin: { // update the left, bottom, right, top margin + l: 60, b: 35, r: 10, t: 25 + } + }; + $('plot_details').style.display = "none"; + $('webtronics_graph_display').style.display = "block"; + Plotly.newPlot(document.getElementById('webtronics_graph_display'), dataForPlotly, layout); + } + } + + }); + })
\ No newline at end of file diff --git a/views/script/gui.js b/views/script/gui.js index 70f5067..2793b29 100644 --- a/views/script/gui.js +++ b/views/script/gui.js @@ -17,7 +17,7 @@ var webtronics={ tabs:[],
mode:'',
-
+
Vlist:/\s*expression|\s*url|.*script/,
Alist:/^(x|y|x1|y1|x2|y2|dx|dy|cx|cy|r|width|height|style|transform|d|id|xml:space|class|fill|stroke|text-anchor|visibility|fill-opacity|stroke-linejoin|stroke-linecap|stroke-opacity|stroke-width|xmlns|xmlns:wtx|connects|partvalue|flippable|spice|index|font-size|font-weight|font-style|font-family)$/,
Elist:/^(path|circle|rect|line|text|g|tspan|svg|wtx:limitswitch|wtx:irev|wtx:rbreak|wtx:inoffset|wtx:gain|wtx:outoffset|wtx:ingain|wtx:outgain|wtx:denoffset|wtx:dengain|wtx:numoffset|wtx:numgain|wtx:fraction|wtx:dendomain|wtx:denlowerlimit|wtx:outlowerlimit|wtx:outupperlimit|wtx:limitrange|wtx:upperdelta|wtx:lowerdelta|wtx:indomain|wtx:xarr|wtx:yarr|wtx:amodel|wtx:coff|wtx:con|wtx:roff|wtx:ron|wtx:log|wtx:vbreak|wtx:ibreak|wtx:isat|wtx:nfor|wtx:rsource|wtx:rsink|wtx:ilimitsource|wtx:ilimitsink|wtx:vpwr|wtx:isource|wtx:isink|wtx:routdomain|wtx:inlow|wtx:inhigh|wtx:hyst|wtx:outic|wtx:numcoeff|wtx:dencoeff|wtx:intic|wtx:denormfreq|wtx:riseslope|wtx:fallslope|wtx:outlow|wtx:outhigh|wtx:cntlarr|wtx:freqarr|wtx:duty|wtx:risetime|wtx:falltime|wtx:clktrig|wtx:pwarr|wtx:ptrig|wtx:rdelay|wtx:fdelay|wtx:rmax|wtx:rmin|wtx:rinit|wtx:vt|wtx:alpha|wtx:beta|wtx:eval1|wtx:eval2|wtx:eval3|wtx:eval4|wtx:eval5|wtx:eval6|wtx:pwlval1|wtx:pwlval2|wtx:pwlval3|wtx:pwlval4|wtx:pwlval5|wtx:pwlval6|wtx:pwlval7|wtx:pwlval8|wtx:pulval1|wtx:pulval2|wtx:pulval3|wtx:pulval4|wtx:pulval5|wtx:pulval6|wtx:pulval7|wtx:amplitude|wtx:phase|wtx:offsetvoltage|wtx:voltageamplitude|wtx:frequency|wtx:delaytime|wtx:dampingfactor|wtx:part|wtx:pins|wtx:analog|wtx:digital|wtx:node|wtx:id|wtx:type|wtx:name|wtx:category|wtx:value|wtx:label|wtx:spice|wtx:risedelay|wtx:inputload|wtx:falldelay|wtx:flip|wtx:model|wtx:measure|metadata|)$/,
@@ -1416,6 +1416,10 @@ Event.observe($('webtronics_chips_open'), 'click', function() { Event.observe($('webtronics_netlist_simulate'), 'click', function() {
$('webtronics_plot_box').style.display = "block";
+ $('plot_details').style.display = "block";
+ $('abscissa_value').value = "";
+ $('ordinate_value').value = "";
+ $('webtronics_graph_display').style.display = "none";
webtronics.center($('webtronics_plot_box'));
webtronics.disablepage();
});
diff --git a/views/style/schematic.css b/views/style/schematic.css index d76bb2e..d8f49e8 100644 --- a/views/style/schematic.css +++ b/views/style/schematic.css @@ -256,9 +256,13 @@ div.modal>*{ } #webtronics_graph_display{ - width:500px; - height:300px; + width:520px; + height:310px; } +/* +#webtronics_plot_cancel{ + float: right; +}*/ #webtronics_chips_box>*{ float:left; |