Estoy trabajando en un sitio web que muestra diferentes espectros. Los muestro como gráficos usando ChartJS. En este momento estoy mostrando dos tipos diferentes de espectros.

Puedo cambiar de uno a otro con esos dos botones:

 <div class="w-full flex flex-row"> <button class="w-1/2 py-1 bg-green-600 text-xl text-gray-100 font-medium transition-colors hover:text-gray-900 focus:outline-none" id="button-spectrum" type="button"> Spectrum </button> <button class="w-1/2 py-1 bg-gray-100 text-xl font-medium transition-colors hover:text-green-600 focus:outline-none" id="button-normalized-spectrum" type="button"> Normalized spectrum </button> </div>

Luego uso un botón que descarga un espectro a png.

 document.getElementById("button-save-png").addEventListener("click", function () { let image; setTimeout(function () { image = normalized_chart.toBase64Image("image/png", 1); image = chart.toBase64Image("image/png", 1); let link = document.createElement("a"); let date = new Date(); // define the name of the download PNG link.download = spec_name + "-graph-" + ("00" + (date.getMonth() + 1)).slice(-2) + "_" + ("00" + date.getDate()).slice(-2) + "_" + date.getFullYear() + "-" + ("00" + date.getHours()).slice(-2) + "_" + ("00" + date.getMinutes()).slice(-2) + "_" + ("00" + date.getSeconds()).slice(-2) + ".png"; link.href = image; document.body.appendChild(link); link.click(); document.body.removeChild(link); }, 1000); });

Pero ahora mismo, solo puedo descargar el primer tipo de espectro. ¿Cómo puedo hacer que pueda elegir qué espectro quiero descargar y luego descargarlo?