Skip to main content

​
Overview

The servicios array contains utility service information for the property, including service type, stratum level, and monthly costs. This data is displayed in the property details section.

​
Service Object Structure

​
servicio
string
required
Service type identifierCommon values:
  • "gas" - Natural gas
  • "energia" - Electricity
  • "acueducto" - Water and sewage
  • "internet_tv" - Internet and TV
Example: "gas"
​
estrato
number
required
Socioeconomic stratum level (1-6)Determines service pricing tiers in Colombia. Lower strata receive subsidies, higher strata pay surcharges.Example: 3
​
valor
number
required
Monthly service cost in Colombian pesos (COP)Example: 25000

​
Example Services Array

"servicios": [
  {
    "servicio": "gas",
    "estrato": 3,
    "valor": 25000
  },
  {
    "servicio": "energia",
    "estrato": 3,
    "valor": 100000
  },
  {
    "servicio": "acueducto",
    "estrato": 3,
    "valor": 115000
  },
  {
    "servicio": "internet_tv",
    "estrato": 3,
    "valor": 125000
  }
]

​
Rendering Services

Services are rendered in the UI by the renderServices() function (app.js:473-495): 
const renderServices = (services) => {
  const container = $("#property-services");
  container.innerHTML = "";

  if (!services || !services.length) {
    container.innerHTML = "<p class='text-slate-500 text-sm'>No hay servicios registrados.</p>";
    return;
  }

  services.forEach((service) => {
    const item = document.createElement("div");
    item.className = "flex justify-between items-center p-3 rounded-xl bg-slate-50 dark:bg-slate-700/30";
    
    const label = document.createElement("span");
    label.className = "text-sm font-medium";
    label.textContent = service.nombre || service.servicio || "Servicio";
    
    const value = document.createElement("span");
    value.className = "text-sm font-bold";
    value.textContent = service.valor ? formatCurrency(service.valor) : "--";
    
    item.appendChild(label);
    item.appendChild(value);
    container.appendChild(item);
  });
};

​
Display Behavior

  • Empty array: Shows “No hay servicios registrados” message
  • Service name: Uses servicio field (or nombre as fallback)
  • Cost formatting: Formats valor as Colombian currency (COP)
  • Missing costs: Displays ”—” when valor is missing

​
Currency Formatting

Service costs are formatted using the formatCurrency() helper (app.js:15-22): 
const formatCurrency = (value) => {
  if (!value && value !== 0) return "--";
  return new Intl.NumberFormat("es-CO", {
    style: "currency",
    currency: "COP",
    maximumFractionDigits: 0,
  }).format(value);
};
Example outputs:
  • Input: 25000 → Output: "$25.000"
  • Input: 100000 → Output: "$100.000"
  • Input: null → Output: "--"

​
Service Types

Common service identifiers found in the data:
Service IDDescriptionTypical Range (COP)
gasNatural gas20,000−20,000 - 50,000
energiaElectricity80,000−80,000 - 150,000
acueductoWater/sewage100,000−100,000 - 150,000
internet_tvInternet & TV100,000−100,000 - 150,000

​
Stratum System Context

In Colombia, the estrato (stratum) system classifies properties into 6 socioeconomic levels:
  • Estrato 1-2: Low income (receive utility subsidies)
  • Estrato 3-4: Middle income (pay standard rates)
  • Estrato 5-6: High income (pay surcharges to subsidize lower strata)
The estrato field in services typically matches the property’s overall stratum (detalles_propiedad.estrato).

​
Data Normalization

Services are passed directly from the property object without transformation: 
const normalizeProperty = (raw) => {
  // ...
  return {
    // ...
    servicios: property?.servicios || [],
    // ...
  };
};
Default: Empty array if servicios is missing

​
Usage Example

Accessing services in the application: 
const loadData = async () => {
  const response = await fetch('./property-5157395.json');
  const data = await response.json();
  
  const services = data.data.property.servicios;
  renderServices(services);
};

​
Total Monthly Costs

To calculate total monthly utility costs: 
const totalServices = services.reduce((sum, service) => {
  return sum + (service.valor || 0);
}, 0);

// Example from property-5157395.json:
// Gas: $25,000
// Energia: $100,000
// Acueducto: $115,000
// Internet/TV: $125,000
// Total: $365,000 COP/month
  • Property Schema - Parent property object
  • Service renderer - renderServices() in app.js:473
  • Currency formatter - formatCurrency() in app.js:15

Build docs developers (and LLMs) love

Get started for freeTalk to us