From Dark and Darker Wiki

No edit summary
No edit summary
 
(18 intermediate revisions by the same user not shown)
Line 1: Line 1:
<includeonly>
<includeonly>
<div>
<div>
   <canvas id="<!--{$id|escape:'html'}-->"></canvas>
   <canvas id="<!--{$uniqueId|escape:'html'}-->"></canvas>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>


<script>
<script>
  var data = JSON.parse('<!--{$data|escape:'quotes'}-->');
  var color = '<!--{$color|escape:'quotes'}-->';
  var gridColor = '<!--{$gridColor|escape:'quotes'}-->';
  var axisColor = '<!--{$axisColor|escape:'quotes'}-->';
  var fontColor = '<!--{$fontColor|escape:'quotes'}-->';
    
    
   var data = JSON.parse('<!--{$data|escape:'quotes'}-->')
   if (color == "") {
  var label = '<!--{$label|escape:'quotes'}-->';
    color = "black";
   var borderColor = '<!--{$borderColor|escape:'quotes'}-->';
   }
   var backgroundColor = '<!--{$backgroundColor|escape:'quotes'}-->';
    
   if (gridColor == "") {
   if (borderColor == "") {
    gridColor = "lightgray";
     borderColor = "black";
   }
   if (axisColor == "") {
     axisColor = gridColor;
   }
   }
   if (backgroundColor == "") {
     backgroundColor = "transparent";
   if (fontColor == "") {
     fontColor = "gray";
   }
   }
    
    
   var max = statsData[0]["x"];
   var max = data[0]["x"];
   var min = max;
   var min = max;
   for (let i = 0; i < statsData.length; i++) {
   for (let i = 0; i < data.length; i++) {
     if (statsData[i]["x"] > max) {
     if (data[i]["x"] > max) {
       max = statsData[i]["x"];
       max = data[i]["x"];
     }
     }
     if (statsData[i]["x"] < min) {
     if (data[i]["x"] < min) {
       min = statsData[i]["x"];
       min = data[i]["x"];
     }
     }
   }
   }
Line 33: Line 40:
   var range = [...Array(max - min + 1).keys()].map((x) => x + min);
   var range = [...Array(max - min + 1).keys()].map((x) => x + min);
    
    
   new Chart(document.getElementById('<!--{$id|escape:'html'}-->'), {
   new Chart(document.getElementById('<!--{$uniqueId|escape:'html'}-->'), {
     type: "line",
     type: "line",
     axisX: {
     axisX: {
Line 43: Line 50:
         {
         {
           data: data,
           data: data,
          label: label,
           borderColor: color,
           borderColor: borderColor,
           backgroundColor: color,
           backgroundColor: backgroundColor,
           fill: false,
           fill: false,
         },
         },
       ],
       ],
     },
     },
    options: {
      plugins:{
        legend: {
          display: false
        }
      },
      scales: {
        y: {
          grid: {
            color: gridColor
          },
          border: {
            color: axisColor
          },
          ticks: {
            color: fontColor
          }
        },
        x: {
          type: 'linear',
          grid: {
            color: gridColor
          },
          border: {
            color: axisColor
          },
          ticks: {
            color: fontColor
          }
        }
      }
    }
   });
   });
 
 
    
    
    
    
</script>
</script>
</includeonly>
</includeonly>

Latest revision as of 06:24, 7 January 2023

Retrieved from "http://darkanddarker.wiki.spellsandguns.com/index.php?title=Widget:Chart&oldid=1708"