thanks to this site for the images! feel free to suggest other good elements from there.
Gold
Platinum
Silver
Helium
Lithium
Beryllium
Lead
Cadmium
Silicon
Calcium
for use on the results of this atomic spectra database:
CSS:
.ac { background-color: red; display: inline-block; width: 1px; height: 200px; }
javurscript:
var jq = document.createElement('script'); jq.src = "http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"; document.getElementsByTagName('head')[0].appendChild(jq);
wait a moment and more javascript:
jQuery.noConflict(); $ = jQuery; var the_table = $($('table')[4]); function do_stuff(start, end, intensity_cutoff) { var wavelengths = []; $(the_table.find('tbody')[1]).find('tr').each(function() { if ($(this).hasClass('evn') || $(this).hasClass('odd')) { $(this).show(); } else { $(this).hide(); return true; } var wavelength_cell = $($(this).find('td')[0]); var wavelength = parseFloat(wavelength_cell.text()); if (wavelength >= start && wavelength <= end) { $(this).show(); } else { $(this).hide(); return true;} var intensity_cell = $($(this).find('td')[2]); var intensity = parseInt(intensity_cell.text(), 10); if (intensity >= intensity_cutoff) { $(this).show(); } else { $(this).hide(); return true;} wavelengths.push((wavelength - start)/(end - start)); }); return wavelengths; } the_table.after($('<div id="shoof-thing"></div>').attr('height', '100px').attr('width', '100%')); var c = $('#shoof-thing') function new_thing(x) { return $('<div></div>').addClass('ac').css('margin-left', x); } var w = do_stuff(380, 760, 9); var l = w.length; var o = []; $.each(w, function(i, v) { if (i == 0) { o.push("" + (v*95) + "%"); } else { o.push("" + ((v-w[i-1])*95) + "%"); } }); c.children().remove(); $.each(o, function(i, v) { c.append(new_thing(v)); });