Facet Layout at Scale
Where do services belong, and which dependencies cross business domains?
How to read this example
- Facets
- Eight business domains group the 640 services.
- Shells
- Core, domains, teams and services preserve the hierarchy.
- Paths
- Highlighted chains remain distinct from the bundled background connections.
Try thisHover a node to highlight its facet and paths, then zoom to inspect individual services. Use the domain overview for orientation before following one chain.
Open the chart without page chrome ↗Drawing width at least 1,100 px. Scroll within the chart on smaller screens.
This example builds its charts with page controls and helpers, so there is no single options object to show. Open the standalone example to read its source.
import WestCoastCharts from 'west-coast-charts'
import types from 'west-coast-charts/types'
import premium from 'west-coast-charts/premium'
import networkFacet from 'west-coast-charts/layers/network-facet'
WestCoastCharts.use(types).use(premium).use(networkFacet)
const WestCoastChartsPremium = premium
const WestCoastChartsLayer_networkFacet = networkFacet
WestCoastCharts.setLicenseKey(LICENCE_KEY) // paid production licence; localhost evaluation needs no key Waiting for the chart.
Open Data & agent view to read this chart through chart.describe().
Read from the running library through its optional agent/describe module. Text, table and JSON share the same snapshot. Demo data only.
$ wcc chart export network-facet-estate.json --out network-facet-estate.svg --with-table Public agent tools 0.2.3, tested with Library 1.1.5; available from the versioned GitHub release and npm. Save a JSON spec first and check the loaded runtime and supported modules before rendering. Command reference
Loading /gallery/network/facet-estate/index.md … This example uses Premium modules. Compare licences · Embedding in a distributed product?