Widget:FloatErrorGraph

From emmtrix Wiki
Jump to navigation Jump to search

<widget type="plotly">

   <script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
   <script type="text/javascript">
       (function() {
           // Fixed data points
           const fixedData = JSON.parse();
           // Extract data for plotting
           const labels = fixedData.map(d => d[0].replace(/\^(-?\d+)/g, '$1'));
           const absErrors = fixedData.map(d => d[1]);
           const ulpAccuracies = fixedData.map(d => d[2]);
           // Define traces for Absolute Error and ULP Accuracy
           const trace1 = {
               x: labels,
               y: absErrors,
               name: 'Absolute Error',
               type: 'scatter',
               mode: 'lines+markers',
               line: { color: 'blue' },
               marker: { size: 6 }
           };
           const trace2 = {
               x: labels,
               y: ulpAccuracies,
               name: 'ULP Accuracy',
               type: 'scatter',
               mode: 'lines+markers',
               line: { color: 'red' },
               marker: { size: 6 },
               yaxis: 'y2'
           };
           // Layout configuration
           const layout = {
               title: 'Accuracy of the Float Algorithm',
               xaxis: {
                   title: 'Range of Input Value',
                   tickangle: -45
               },
               yaxis: {
                   title: 'Absolute Error',
                   type: 'log',
                   exponentformat: 'e'
               },
               yaxis2: {
                   title: 'ULP Error',
                   type: 'log',
                   overlaying: 'y',
                   side: 'right',
                   exponentformat: 'e'
               },
               legend: {
                   x: 0.5,
                   y: -0.2,
                   orientation: 'h'
               },
               height: 500
           };
           // Data array
           const data = [trace1, trace2];
           // Render the plot
           Plotly.newPlot('chart_div_', data, layout);
       })();
   </script>

</widget>