0
import React from "react";
import numeral from "react-numeral";
import {Circle, Popup} from "react-leaflet";


export const showDataOnMap = (data, casesType = "cases") => (
  data.map((country) => (
    <Circle>
      center = {[country.countryInfo.lat, country.countryInfo.long]}

      fillOpacity = {0.4},
      color={casesTypeColors[casesType].hex},
      fillColor={casesTypeColors[casesType].hex},

      radius={
      Math.sqrt(country[casesType]) * casesTypeColors[casesType].multiplier
    }
      <Popup>
        <h6>PLAYBOI BABY</h6>
        <div className="info__container">
          <div className="info__flag"
               style={{backgroundImage: `url(${country.countryInfo.flag})`}}/>
          <div className="info__name">
            {country.country}
          </div>
          <div className="info__confirmed">```


            {/*1. console error (Uncaught TypeError: Class constructor Numeral cannot be invoked without 'new'), i had checked the numeral docs and i did everything as stated in it.*/}


            Cases: {numeral(country.cases).format("0,0")}
          </div>
          <div className="info__recovered">
            Recovered: {numeral(country.recovered).format("0,0")}
          </div>
          <div className="info__deaths">
            Deaths: {numeral(country.deaths).format("0,0")}
          </div>
        </div>
      </Popup>
    </Circle>
  ))
);
  1. console error: Uncaught TypeError: Class constructor Numeral cannot be invoked without 'new', I had checked the numeral docs and I did everything as stated in it.
Cases: {numeral(country.cases).format("0,0")}
          </div>
          <div className="info__recovered">
            Recovered: {numeral(country.recovered).format("0,0")}
          </div>
          <div className="info__deaths">
            Deaths: {numeral(country.deaths).format("0,0")}
          </div>
        </div>
      </Popup>
    </Circle>
  ))
);
  1. console error: Uncaught TypeError: Class constructor Numeral cannot be invoked without 'new', not just in this component but in every component where react-numeral appears.
export const prettyPrintStat = (stat) => (
  stat ? `+${numeral(stat).format("0.0a")}` : "+0"
)

export const sortData = (data) => {
  const sortedData = [...data];

  return sortedData.sort((a, b) => (a.cases > b.cases ? -1 : 1))
};
Liki Crus
  • 1,901
  • 5
  • 16
  • 27
Swizz 6ix
  • 23
  • 1
  • 5
  • numeral and react-numeral are two different packages on npm. You are using numeral as if you want to use http://numeraljs.com/#format, not https://www.npmjs.com/package/react-numeral. You just need to check the official guide about usage. – Ajeet Shah May 02 '22 at 17:30
  • 1
    Thank you very much for the clarity, I very appreciate it. I didn't notice tha they were different packages because, the docs are some how linked together. Thank you once again for the clarity – Swizz 6ix May 02 '22 at 23:46

0 Answers0