JSFiddle - React, Tailwind, and code Playground

by starikcetin

HTML

<script src="https://unpkg.com/@paraboly/[email protected]/dist/pwc-map-legend.js"></script>
<pwc-map-legend 
  counts='["1512","150","64"]' 
  title-text="Custom Legend Title" 
  color-array='["hello", "hello2"]' 
  names='["USA", "Ireland","Turkey"]' 
  colors='["#BD0003", "#3469CC", "darkGreen"]' />

JavaScript

var pwcMapLegend = document.querySelector("pwc-map-legend");
console.log(pwcMapLegend);
pwcMapLegend.titleText = "Legend";
pwcMapLegend.counts = [215, 610, 5111];
pwcMapLegend.colors = ["red", "blue", "orange"];
pwcMapLegend.names = ["Paraboly", "Google", "Apple"];
pwcMapLegend.svgStyles = [{
    "stroke-dasharray": "4 1 2 3",
    "stroke-opacity": 0.9
  },
  {
    "stroke-dasharray": "4 1",
    "stroke-opacity": 0.5
  },
  {
    "stroke-dasharray": 4,
    "stroke-opacity": 0.9
  }
];