
Avant Data ROI 試算
https://cdn.jsdelivr.net/npm/chart.js
body { font-family: sans-serif; background: #ffffff; color: #333; padding: 20px; }
.container { max-width: 400px; margin: auto; }
label { display: block; margin-top: 10px; }
input, select, button { width: 100%; padding: 8px; margin-top: 5px; }
#result { margin-top: 20px; font-weight: bold; text-align: center; }
canvas { max-width: 100%; margin-top: 20px; }
Avant Data ROI 試算工具
選擇方案:
30 筆
100 筆
180 筆
300 筆
輸入平均客單價 (NT$):
輸入預估私訊成交率 (%):
立即試算
const planCosts = {“30″: 225000, “100″: 600000, “180″: 990000, “300″: 1440000};
let chartInstance = null;
function calculateROI() {
const plan = document.getElementById(‘plan’).value;
const price = parseFloat(document.getElementById(‘price’).value);
const rateInput = document.getElementById(‘rate’).value;
const rate = rateInput ? parseFloat(rateInput) / 100 : 0.1;
if (!price || price <= 0) {
alert('請輸入有效的平均客單價');
return;
}
const quantity = parseInt(plan);
const estimatedRevenue = price * quantity * rate;
const cost = planCosts[plan];
const roi = estimatedRevenue / cost;
const roiPercent = (roi * 100).toFixed(1);
document.getElementById('result').innerHTML =
`預估營收:NT$${estimatedRevenue.toLocaleString()}
` +
`名單成本:NT$${cost.toLocaleString()}
` +
`ROI 投報率:${roiPercent}%`;
const ctx = document.getElementById(‘roiChart’).getContext(‘2d’);
if (chartInstance) {
chartInstance.destroy();
}
chartInstance = new Chart(ctx, {
type: ‘doughnut’,
data: {
labels: [‘預估營收’, ‘成本未回收部分’],
datasets: [{
data: [estimatedRevenue, Math.max(0, cost – estimatedRevenue)],
backgroundColor: [‘#007BFF’, ‘#CCCCCC’],
}]
},
options: {
plugins: {
tooltip: {
callbacks: {
label: function(context) {
return context.label + ‘: NT$’ + context.parsed.toLocaleString();
}
}
}
}
}
});
}