Permalink
Switch branches/tags
Nothing to show
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
163 lines (140 sloc) 4.67 KB
layout title categories description
page
Galvanostatic simulator web app
articles
A JavaScript web app for galvanostatic simulations, built with plotly.js
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/mathjs/3.16.3/math.min.js"></script> <script src="/assets/galv_sim.js" type="text/javascript"></script>
<style>
  html, body, h1, h2, h3, h4, h5, h6 {
  font: 400 16px/1.5 "Helvetica Neue", Helvetica, Arial, sans-serif;
}
input[type=text] {
  padding: 2px 2px;
  margin: 2px 0;
  box-sizing: border-box;
}
/* Create two equal columns that floats next to each other */
.column {
  float: left;
  width: 50%;
  padding: 10px;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}
</style>
This app simulates a one-electron electrochemical reaction under galvanostatic control:

$$ O + e^- \overset{k_f}{\underset{k_r}{\leftrightarrows}} R $$

I wrote tutorials describing this simulation here. I hope that this tool increases the accessibility of simple electrochemical simulations. Please contact me with any questions, comments, or suggestions!

To save an image and extract the x-y data, use the first two buttons in the toolbar.




$ C_O = $ $ \text{mol/cm}^3 $, initial concentration of $ O $
$ D = $ $ \text{cm}^2 \text{/s} $, diffusion coefficient of both $ O $ and $ R $
$ j = $ $ \text{A/m}^2 $, applied current
$ n = $ , $ e^- $ per reaction
$ \alpha = $ , charge transfer coefficient
$ k_0 = $ $ \text{cm/s} $, electrochemical rate constant
$ L = $ , simulation resolution

Legend:

Add Remove
Simulation timescale, $ \tau = $ $ \text{h} $


<script> galv_plotID = document.getElementById('galv_plot'); // Initialize CV plot with IV curve generated using default values var result = galv_plot(); var xdata = result[0]; var ydata = result[1]; var trace1 = { x: xdata, y: ydata, type: 'scatter', mode: 'lines', name: 'sim1', line: { width: 3 } }; var data = [trace1]; var layout = { title: 'Galvanostatic simulation', xaxis: { title: 'Voltage (V vs O/O-)', showgrid: true, zeroline: false }, yaxis: { title: 'A(dQ/dV) (Ah/V)', showgrid: true, zeroline: false }, displaylogo: false, hovermode: 'closest' }; Plotly.newPlot('galv_plot', data, layout); // Add button document.getElementById('addDataset').addEventListener('click', function() { // Get legend legendlabel = document.getElementById('legend').value; // Run simulation var result = galv_plot(); var xdata = result[0]; var ydata = result[1]; var newline = { x: xdata, y: ydata, type: 'scatter', mode: 'lines', name: legendlabel, line: { width: 3 } }; // add data and update plot data.push(newline); Plotly.newPlot('galv_plot', data, layout); // update legend text box var simnum = data.length + 1; document.getElementById('legend').value = 'sim' + simnum.toString(); }); // Remove button document.getElementById('removeDataset').addEventListener('click', function() { // remove data and update plot data.pop(); Plotly.newPlot('galv_plot', data, layout); // update legend text box var simnum = data.length + 1; document.getElementById('legend').value = 'sim' + simnum.toString(); }); </script>