I try to create a random plot using js

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Random Plot</title>
    <!-- Include Plotly.js -->
    <script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
    <style>
        /* Custom CSS for styling the plot container */
        #plot {
            width: 800px;
            height: 400px;
            margin: 0 auto;
        }
    </style>
</head>
<body>
    <!-- Your plot will be displayed here -->
    <div id="plot"></div>

    <script>
        // Generate some random data
        const numPoints = 100;
        const xData = Array.from({length: numPoints}, () => Math.random() * 10);
        const yData = Array.from({length: numPoints}, () => Math.random() * 10);
        const colors = Array.from({length: numPoints}, () => `rgb(${Math.random() * 255}, ${Math.random() * 255}, ${Math.random() * 255})`);

        // Create a trace for the scatter plot
        const trace = {
            x: xData,
            y: yData,
            mode: 'markers',
            type: 'scatter',
            marker: {
                color: colors,
                size: 10,
                opacity: 0.8
            }
        };

        // Define layout options
        const layout = {
            title: 'Beautiful Random Plot',
            xaxis: {
                title: 'X-axis',
                tickfont: {
                    size: 14,
                    color: 'black'
                }
            },
            yaxis: {
                title: 'Y-axis',
                tickfont: {
                    size: 14,
                    color: 'black'
                }
            },
            plot_bgcolor: 'rgba(255, 255, 255, 0.9)',
            paper_bgcolor: 'rgba(255, 255, 255, 0.9)',
            font: {
                family: 'Arial, sans-serif',
                size: 16,
                color: 'black'
            }
        };

        // Combine data and layout, then plot
        Plotly.newPlot('plot', [trace], layout);
    </script>
</body>
</html>


Here is the final result