Bar Chart - clawam tools

Zum Hauptinhalt springen

clawam tools

Werkzeuge Dokumente Daoark EN Startseite Startseite / Datenkonvertierung › Startseite manifest.json 0; }); var pts = []; for (var i = 0; i < lines.length; i++) { var parts = lines[i].split(/[\s,;\t]+/).filter(function(x) { return x.length > 0; }); if (parts.length === 1) pts.push({ label: '#' + (i+1), value: parseFloat(parts[0]) }); else if (parts.length >= 2) { var label = parts.slice(0, parts.length - 1).join(' '); pts.push({ label: label, value: parseFloat(parts[parts.length - 1]) }); } } return pts; } function escape(s) { return String(s).replace(/[&<>"']/g, function(c) { return {'&':'&','<':'<','>':'>','"':'"',"'":'''}[c]; }); } function renderBarChart(pts, title, ylabel, orient) { if (pts.length === 0) return ''; var W = 720, H = 420; var M = { top: 50, right: 40, bottom: 80, left: orient === 'h' ? 120 : 70 }; var innerW = W - M.left - M.right; var innerH = H - M.top - M.bottom; var yMax = Math.max.apply(null, pts.map(function(p) { return p.value; })); if (yMax <= 0) yMax = 1; var colors = ['#3b82f6','#10b981','#f59e0b','#ef4444','#8b5cf6','#ec4899','#06b6d4','#84cc16','#f97316','#6366f1']; var svg = ''; return svg; } var currentSVG = ''; function doProcess() { try { var textA = getVal('text-a'); if (!textA) { showError('请输入数据'); return; } var title = getVal('title'); var ylabel = getVal('ylabel'); var orient = getVal('orient'); var pts = parseData(textA); if (pts.length === 0) { showError('无有效数据'); return; } var svg = renderBarChart(pts, title, ylabel, orient); currentSVG = svg; showResult(svg, '类别数: ' + pts.length + ', 最大值: ' + Math.max.apply(null, pts.map(function(p){return p.value;})) + ', 方向: ' + (orient === 'v' ? '纵向' : '横向')); } catch (e) { showError('处理失败: ' + (e.message || e)); } } $('btn-main').addEventListener('click', function(e) { e.preventDefault(); doProcess(); }); $('btn-clear').addEventListener('click', function() { var inputs = document.querySelectorAll('input,textarea,select'); for (var i = 0; i < inputs.length; i++) { if (inputs[i].tagName === 'SELECT') inputs[i].selectedIndex = 0; else inputs[i].value = inputs[i].defaultValue; } var ra = $('result-area'); ra.hidden = true; ra.style.display = 'none'; var em = $('error-msg'); em.hidden = true; em.style.display = 'none'; $('btn-download').style.display = 'none'; }); $('btn-download').addEventListener('click', function() { if (!currentSVG) return; var blob = new Blob([currentSVG], { type: 'image/svg+xml' }); var url = URL.createObjectURL(blob); var a = document.createElement('a'); a.href = url; a.download = 'bar-chart.svg'; a.click(); URL.revokeObjectURL(url); }); })();