Money Geek UI Components
BadgeBest RankingBoxBreakLineButtonColumn Range ChartColumnsCompany Cross LinkingCompany LogoContent ValidatorExpand/CollapseIconList RankingOrderedListPlaygroundPremiumRankingMonthly PremiumsMarket ShareCustom Data Basic UsagePros/ConsQuoteQuote ButtonQuotesWidgetReadmeStar RankingState Cross LinkingStaticPremiumTableStaticTable

PremiumRanking

type
string
category
'average' │ 'seniors' │ 'students' │ 'speeding' │ 'dui' │ 'badCredit' │ 'liability'
state
string
year
string
datatype
'monthly-premiums' │ 'market-share' │ 'financial-stability'
quotebutton
string
data
object │ Array<object>
reviewPages
object │ Array<object>
showMonthlyValue
bool
false
showDescription
'true' │ 'false'
'false'
regionLevel
'national' │ 'state'
rows
object
margin
object

In the following sections the usage of the monthly-premiums and market-share datatypes are shown including its rendering for each category.

Contents:

Monthly Premiums

  1. Average Report
  2. DUI Report
  3. Seniors Report
  4. Students Report
  5. Speeding Distracted Report
  6. Bad Credit Report
  7. Liability Report

Market Share

  1. With 'Get Quote' Button
  2. Without 'Get Quote' Button

Custom Data Basic Usage

  1. Custom Monthly Premium
  2. Custom Market Share

Monthly Premiums

Average Report

DUI Report

Seniors Report

Students Report

Speeding Distracted Report

Bad Credit Report

Liability Report

Market Share

With 'Get Quote' Button

Without 'Get Quote' Button

Custom Data Basic Usage

Custom Monthly Premium

Structure defined for data parameter:

const monthlyPremiumData = {
  category: 'speeding',
  region: 'New York',
  year: '2020',
  companies: [
    { value: 1301, company: 'Allstate F&C', currency: 'USD' },
    { value: 829, company: 'State Farm Mutual Auto', currency: 'USD' },
    { value: 1418, company: 'Progressive Cty Mtl', currency: 'USD' },
    { value: 1469, company: 'GEICO Govt Employees', currency: 'USD' },
    { value: 1139, company: 'Progressive Cty Mutual ADV', currency: 'USD' },
    { value: 971, company: 'USAA', currency: 'USD' }
  ]
};

Custom Market Share

Structure defined for data parameter:

const marketShareData = [
  { company: 'Progressive', value: 0.1118, url: 'https://www.progressive.com/auto/' },
  { company: 'Farmers', value: 0.0817},
  { company: 'Allstate', value: 0.1165, url: 'https://www.allstate.com/auto-insurance.aspx' },
  { company: 'State Farm', value: 0.1499, url: 'https://www.statefarm.com/insurance/auto' },
  { company: ' USAA', value: 0.0844, url: 'https://www.usaa.com/inet/wc/auto-insurance' },
  { company: 'GEICO', value: 0.1310 }
];

Custom Financial Stability

Structure defined for data parameter:

const financialStabilityData = [
  { company: 'Allstate', value: 'A-', url: 'https://www.allstate.com/auto-insurance.aspx' },
  { company: 'Progressive', value: 'B', url: 'https://www.progressive.com/auto/' },
  { company: 'State Farm', value: 'A++', url: 'https://www.statefarm.com/insurance/auto' },
  { company: 'GEICO', value: 'A' }
];