mirror of
https://github.com/anomalyco/opencode.git
synced 2026-08-29 06:32:02 +00:00
remove map
This commit is contained in:
parent
d0ceaef6aa
commit
2564a4f172
20 changed files with 13 additions and 145 deletions
|
|
@ -126,8 +126,7 @@ const en = {
|
|||
"home.noMarketDescription": "No model rows matched this range.",
|
||||
"home.marketChart": "Market share by model author",
|
||||
"home.noData": "No data",
|
||||
"home.geoTitle": "Geo Breakdown",
|
||||
"home.geoDescription": "Tokens used by country.",
|
||||
"home.geoTitle": "Geographic Breakdown",
|
||||
"home.noGeoTitle": "No geo data",
|
||||
"home.noGeoDescription": "No geo rows matched this range.",
|
||||
"home.worldMap": "World map of token usage by country",
|
||||
|
|
|
|||
|
|
@ -108,7 +108,6 @@ export const dict = {
|
|||
"home.marketChart": "حصة السوق حسب مؤلف النموذج",
|
||||
"home.noData": "لا توجد بيانات",
|
||||
"home.geoTitle": "التوزيع الجغرافي",
|
||||
"home.geoDescription": "الرموز المستخدمة حسب البلد.",
|
||||
"home.noGeoTitle": "لا توجد بيانات جغرافية",
|
||||
"home.noGeoDescription": "لم تطابق أي صفوف جغرافية هذا النطاق.",
|
||||
"home.worldMap": "خريطة عالمية لاستخدام الرموز حسب البلد",
|
||||
|
|
|
|||
|
|
@ -109,7 +109,6 @@ export const dict = {
|
|||
"home.marketChart": "Participação de mercado por autor do modelo",
|
||||
"home.noData": "Sem dados",
|
||||
"home.geoTitle": "Distribuição geográfica",
|
||||
"home.geoDescription": "Tokens usados por país.",
|
||||
"home.noGeoTitle": "Sem dados geográficos",
|
||||
"home.noGeoDescription": "Nenhuma linha geográfica correspondeu a este intervalo.",
|
||||
"home.worldMap": "Mapa-múndi do uso de tokens por país",
|
||||
|
|
|
|||
|
|
@ -109,7 +109,6 @@ export const dict = {
|
|||
"home.marketChart": "Markedsandel efter modelforfatter",
|
||||
"home.noData": "Ingen data",
|
||||
"home.geoTitle": "Geografisk opdeling",
|
||||
"home.geoDescription": "Tokens brugt efter land.",
|
||||
"home.noGeoTitle": "Ingen geodata",
|
||||
"home.noGeoDescription": "Ingen georækker matchede dette interval.",
|
||||
"home.worldMap": "Verdenskort over tokenbrug efter land",
|
||||
|
|
|
|||
|
|
@ -109,7 +109,6 @@ export const dict = {
|
|||
"home.marketChart": "Marktanteil nach Modellautor",
|
||||
"home.noData": "Keine Daten",
|
||||
"home.geoTitle": "Geografische Aufschlüsselung",
|
||||
"home.geoDescription": "Nach Land verwendete Tokens.",
|
||||
"home.noGeoTitle": "Keine Geodaten",
|
||||
"home.noGeoDescription": "Keine Geozeilen passten zu diesem Zeitraum.",
|
||||
"home.worldMap": "Weltkarte der Tokennutzung nach Land",
|
||||
|
|
|
|||
|
|
@ -108,7 +108,6 @@ export const dict = {
|
|||
"home.marketChart": "Cuota de mercado por autor del modelo",
|
||||
"home.noData": "Sin datos",
|
||||
"home.geoTitle": "Desglose geográfico",
|
||||
"home.geoDescription": "Tokens usados por país.",
|
||||
"home.noGeoTitle": "Sin datos geográficos",
|
||||
"home.noGeoDescription": "Ninguna fila geográfica coincidió con este rango.",
|
||||
"home.worldMap": "Mapa mundial del uso de tokens por país",
|
||||
|
|
|
|||
|
|
@ -109,7 +109,6 @@ export const dict = {
|
|||
"home.marketChart": "Part de marché par auteur de modèle",
|
||||
"home.noData": "Aucune donnée",
|
||||
"home.geoTitle": "Répartition géographique",
|
||||
"home.geoDescription": "Tokens utilisés par pays.",
|
||||
"home.noGeoTitle": "Aucune donnée géographique",
|
||||
"home.noGeoDescription": "Aucune ligne géographique ne correspondait à cette période.",
|
||||
"home.worldMap": "Carte mondiale de l'utilisation des tokens par pays",
|
||||
|
|
|
|||
|
|
@ -109,7 +109,6 @@ export const dict = {
|
|||
"home.marketChart": "Quota di mercato per autore del modello",
|
||||
"home.noData": "Nessun dato",
|
||||
"home.geoTitle": "Ripartizione geografica",
|
||||
"home.geoDescription": "Token usati per paese.",
|
||||
"home.noGeoTitle": "Nessun dato geografico",
|
||||
"home.noGeoDescription": "Nessuna riga geografica corrispondeva a questo intervallo.",
|
||||
"home.worldMap": "Mappa mondiale dell'utilizzo dei token per paese",
|
||||
|
|
|
|||
|
|
@ -111,7 +111,6 @@ export const dict = {
|
|||
"home.marketChart": "モデル作者別マーケットシェア",
|
||||
"home.noData": "データなし",
|
||||
"home.geoTitle": "地域別内訳",
|
||||
"home.geoDescription": "国別のトークン使用量。",
|
||||
"home.noGeoTitle": "地域データがありません",
|
||||
"home.noGeoDescription": "この期間に一致する地域行はありません。",
|
||||
"home.worldMap": "国別トークン使用量の世界地図",
|
||||
|
|
|
|||
|
|
@ -111,7 +111,6 @@ export const dict = {
|
|||
"home.marketChart": "모델 작성자별 시장 점유율",
|
||||
"home.noData": "데이터 없음",
|
||||
"home.geoTitle": "지역별 분포",
|
||||
"home.geoDescription": "국가별 사용 토큰입니다.",
|
||||
"home.noGeoTitle": "지역 데이터 없음",
|
||||
"home.noGeoDescription": "이 범위에 맞는 지역 행이 없습니다.",
|
||||
"home.worldMap": "국가별 토큰 사용량 세계 지도",
|
||||
|
|
|
|||
|
|
@ -109,7 +109,6 @@ export const dict = {
|
|||
"home.marketChart": "Markedsandel etter modellforfatter",
|
||||
"home.noData": "Ingen data",
|
||||
"home.geoTitle": "Geografisk fordeling",
|
||||
"home.geoDescription": "Tokens brukt etter land.",
|
||||
"home.noGeoTitle": "Ingen geodata",
|
||||
"home.noGeoDescription": "Ingen georader matchet dette intervallet.",
|
||||
"home.worldMap": "Verdenskart over tokenbruk etter land",
|
||||
|
|
|
|||
|
|
@ -108,7 +108,6 @@ export const dict = {
|
|||
"home.marketChart": "Udział w rynku według autora modelu",
|
||||
"home.noData": "Brak danych",
|
||||
"home.geoTitle": "Podział geograficzny",
|
||||
"home.geoDescription": "Tokeny użyte według kraju.",
|
||||
"home.noGeoTitle": "Brak danych geograficznych",
|
||||
"home.noGeoDescription": "Żadne wiersze geograficzne nie pasowały do tego zakresu.",
|
||||
"home.worldMap": "Mapa świata użycia tokenów według kraju",
|
||||
|
|
|
|||
|
|
@ -109,7 +109,6 @@ export const dict = {
|
|||
"home.marketChart": "Доля рынка по автору модели",
|
||||
"home.noData": "Нет данных",
|
||||
"home.geoTitle": "Географический разрез",
|
||||
"home.geoDescription": "Токены, использованные по странам.",
|
||||
"home.noGeoTitle": "Нет геоданных",
|
||||
"home.noGeoDescription": "Нет географических строк для этого диапазона.",
|
||||
"home.worldMap": "Карта мира использования токенов по странам",
|
||||
|
|
|
|||
|
|
@ -110,7 +110,6 @@ export const dict = {
|
|||
"home.marketChart": "ส่วนแบ่งตลาดตามผู้สร้างโมเดล",
|
||||
"home.noData": "ไม่มีข้อมูล",
|
||||
"home.geoTitle": "แยกตามภูมิศาสตร์",
|
||||
"home.geoDescription": "token ที่ใช้แยกตามประเทศ",
|
||||
"home.noGeoTitle": "ไม่มีข้อมูลภูมิศาสตร์",
|
||||
"home.noGeoDescription": "ไม่มีแถวภูมิศาสตร์ที่ตรงกับช่วงเวลานี้",
|
||||
"home.worldMap": "แผนที่โลกของการใช้ token แยกตามประเทศ",
|
||||
|
|
|
|||
|
|
@ -109,7 +109,6 @@ export const dict = {
|
|||
"home.marketChart": "Model yazarına göre pazar payı",
|
||||
"home.noData": "Veri yok",
|
||||
"home.geoTitle": "Coğrafi Dağılım",
|
||||
"home.geoDescription": "Ülkeye göre kullanılan tokenlar.",
|
||||
"home.noGeoTitle": "Coğrafi veri yok",
|
||||
"home.noGeoDescription": "Bu aralıkla eşleşen coğrafi satır yok.",
|
||||
"home.worldMap": "Ülkeye göre token kullanımının dünya haritası",
|
||||
|
|
|
|||
|
|
@ -109,7 +109,6 @@ export const dict = {
|
|||
"home.marketChart": "Частка ринку за автором моделі",
|
||||
"home.noData": "Немає даних",
|
||||
"home.geoTitle": "Географічний розріз",
|
||||
"home.geoDescription": "Токени, використані за країнами.",
|
||||
"home.noGeoTitle": "Немає геоданих",
|
||||
"home.noGeoDescription": "Жодні географічні рядки не відповідали цьому діапазону.",
|
||||
"home.worldMap": "Карта світу використання токенів за країнами",
|
||||
|
|
|
|||
|
|
@ -110,7 +110,6 @@ export const dict = {
|
|||
"home.marketChart": "按模型作者显示的市场份额",
|
||||
"home.noData": "无数据",
|
||||
"home.geoTitle": "地理分布",
|
||||
"home.geoDescription": "按国家/地区统计的 token 使用量。",
|
||||
"home.noGeoTitle": "无地理数据",
|
||||
"home.noGeoDescription": "没有符合该时间范围的地理行。",
|
||||
"home.worldMap": "按国家/地区显示 token 使用量的世界地图",
|
||||
|
|
|
|||
|
|
@ -110,7 +110,6 @@ export const dict = {
|
|||
"home.marketChart": "按模型作者顯示的市場佔有率",
|
||||
"home.noData": "無數據",
|
||||
"home.geoTitle": "地理分布",
|
||||
"home.geoDescription": "按國家/地區統計的 token 使用量。",
|
||||
"home.noGeoTitle": "無地理數據",
|
||||
"home.noGeoDescription": "沒有符合該時間範圍的地理列。",
|
||||
"home.worldMap": "按國家/地區顯示 token 使用量的世界地圖",
|
||||
|
|
|
|||
|
|
@ -21,7 +21,6 @@ import { useI18n } from "../context/i18n"
|
|||
import { useLanguage } from "../context/language"
|
||||
import { localizedUrl } from "../lib/language"
|
||||
import { findModelCatalogEntry, loadModelCatalog, type ModelCatalog } from "./model-catalog"
|
||||
import { geoMapHeight, geoMapWidth, worldBorderPath, worldCountryMarkers, worldCountryPaths } from "./geo-map"
|
||||
import { SectionHeading } from "./section-heading"
|
||||
import { setStatsPageCacheHeaders } from "./stats-cache"
|
||||
import { ComparisonCardsSection, uniqueComparisonPairs, type ComparisonModelRef } from "./compare-cards"
|
||||
|
|
@ -317,7 +316,7 @@ function ChartSection(props: {
|
|||
)
|
||||
}
|
||||
|
||||
function SectionTitle(props: { id: string; title: string; description: string }) {
|
||||
function SectionTitle(props: { id: string; title: string; description?: string }) {
|
||||
return <SectionHeading href={`#${props.id}`} title={props.title} description={props.description} />
|
||||
}
|
||||
|
||||
|
|
@ -1074,20 +1073,9 @@ function MarketShareList(props: {
|
|||
|
||||
function GeoBreakdownSection(props: { data: CountryEntry[] }) {
|
||||
const i18n = useI18n()
|
||||
const language = useLanguage()
|
||||
const [activeCountry, setActiveCountry] = createSignal<string>()
|
||||
const countryById = createMemo(
|
||||
() =>
|
||||
new Map(
|
||||
props.data.flatMap((country) => {
|
||||
const id = countryNumericId(country.country)
|
||||
return id ? [[id, country] as const] : []
|
||||
}),
|
||||
),
|
||||
)
|
||||
const maxTokens = createMemo(() => Math.max(0, ...props.data.map((country) => country.tokens)) || 1)
|
||||
const topCountries = createMemo(() => props.data.slice(0, 15))
|
||||
const active = createMemo(() => props.data.find((country) => country.country === activeCountry()) ?? props.data[0])
|
||||
|
||||
return (
|
||||
<section
|
||||
|
|
@ -1099,34 +1087,12 @@ function GeoBreakdownSection(props: { data: CountryEntry[] }) {
|
|||
}}
|
||||
>
|
||||
<SectionBridge label={i18n.t("nav.marketShare").toUpperCase()} href="#market-share" />
|
||||
<SectionTitle id="geo-breakdown" title={i18n.t("home.geoTitle")} description={i18n.t("home.geoDescription")} />
|
||||
<SectionTitle id="geo-breakdown" title={i18n.t("home.geoTitle")} />
|
||||
<Show
|
||||
when={props.data.length > 0}
|
||||
fallback={<EmptyState title={i18n.t("home.noGeoTitle")} description={i18n.t("home.noGeoDescription")} />}
|
||||
>
|
||||
<div data-component="geo-breakdown">
|
||||
<div data-slot="geo-map-panel">
|
||||
<GeoWorldMap
|
||||
countryById={countryById()}
|
||||
activeCountry={activeCountry()}
|
||||
maxTokens={maxTokens()}
|
||||
onActiveCountryChange={setActiveCountry}
|
||||
/>
|
||||
<Show when={active()}>
|
||||
{(country) => (
|
||||
<div data-slot="geo-active-country">
|
||||
<span>#{String(country().rank).padStart(2, "0")}</span>
|
||||
<strong>
|
||||
{formatCountryName(country().country, language.tag(language.locale()), i18n.t("home.unknown"))}
|
||||
</strong>
|
||||
<p>
|
||||
<b>{formatGeoTokens(country().tokens)}</b>
|
||||
<em>{formatGeoShare(country().share)}</em>
|
||||
</p>
|
||||
</div>
|
||||
)}
|
||||
</Show>
|
||||
</div>
|
||||
<GeoCountryList
|
||||
data={topCountries()}
|
||||
activeCountry={activeCountry()}
|
||||
|
|
@ -1139,92 +1105,6 @@ function GeoBreakdownSection(props: { data: CountryEntry[] }) {
|
|||
)
|
||||
}
|
||||
|
||||
function GeoWorldMap(props: {
|
||||
countryById: Map<string, CountryEntry>
|
||||
activeCountry: string | undefined
|
||||
maxTokens: number
|
||||
onActiveCountryChange: (country: string | undefined) => void
|
||||
}) {
|
||||
const i18n = useI18n()
|
||||
const opacityScale = createMemo(() => scaleSqrt().domain([0, props.maxTokens]).range([0.26, 0.96]).clamp(true))
|
||||
const countryOpacity = (country: CountryEntry | undefined) => {
|
||||
if (!country || country.tokens <= 0) return 0
|
||||
const opacity = opacityScale()(country.tokens)
|
||||
if (props.activeCountry === country.country) return 1
|
||||
if (!props.activeCountry) return opacity
|
||||
return Math.max(0.18, opacity * 0.36)
|
||||
}
|
||||
|
||||
return (
|
||||
<svg
|
||||
data-component="geo-world-map"
|
||||
viewBox={`0 0 ${geoMapWidth} ${geoMapHeight}`}
|
||||
role="img"
|
||||
aria-label={i18n.t("home.worldMap")}
|
||||
>
|
||||
<title>{i18n.t("home.geoMapTitle")}</title>
|
||||
<g data-slot="geo-countries">
|
||||
<For each={worldCountryPaths}>
|
||||
{(country) => {
|
||||
const entry = () => props.countryById.get(country.id)
|
||||
return (
|
||||
<path
|
||||
d={country.path}
|
||||
data-country-id={country.id}
|
||||
data-has-data={entry() ? "true" : undefined}
|
||||
data-active={entry()?.country === props.activeCountry ? "true" : undefined}
|
||||
style={{ "--geo-country-opacity": String(countryOpacity(entry())) } as JSX.CSSProperties}
|
||||
aria-hidden="true"
|
||||
onPointerEnter={() => {
|
||||
const item = entry()
|
||||
if (!item) return
|
||||
props.onActiveCountryChange(item.country)
|
||||
}}
|
||||
onClick={() => {
|
||||
const item = entry()
|
||||
if (!item) return
|
||||
props.onActiveCountryChange(item.country)
|
||||
}}
|
||||
/>
|
||||
)
|
||||
}}
|
||||
</For>
|
||||
</g>
|
||||
<g data-slot="geo-country-markers">
|
||||
<For each={worldCountryMarkers}>
|
||||
{(country) => {
|
||||
const entry = () => props.countryById.get(country.id)
|
||||
return (
|
||||
<Show when={entry()}>
|
||||
<circle
|
||||
cx={country.marker.x}
|
||||
cy={country.marker.y}
|
||||
data-country-id={country.id}
|
||||
r={entry()?.country === props.activeCountry ? 3.4 : 2.4}
|
||||
data-active={entry()?.country === props.activeCountry ? "true" : undefined}
|
||||
style={{ "--geo-country-opacity": String(countryOpacity(entry())) } as JSX.CSSProperties}
|
||||
aria-hidden="true"
|
||||
onPointerEnter={() => {
|
||||
const item = entry()
|
||||
if (!item) return
|
||||
props.onActiveCountryChange(item.country)
|
||||
}}
|
||||
onClick={() => {
|
||||
const item = entry()
|
||||
if (!item) return
|
||||
props.onActiveCountryChange(item.country)
|
||||
}}
|
||||
/>
|
||||
</Show>
|
||||
)
|
||||
}}
|
||||
</For>
|
||||
</g>
|
||||
<path data-slot="geo-borders" d={worldBorderPath} aria-hidden="true" />
|
||||
</svg>
|
||||
)
|
||||
}
|
||||
|
||||
function GeoCountryList(props: {
|
||||
data: CountryEntry[]
|
||||
activeCountry: string | undefined
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
export function SectionHeading(props: {
|
||||
href: string
|
||||
title: string
|
||||
description: string
|
||||
description?: string
|
||||
as?: "h2" | "p"
|
||||
slot?: string
|
||||
}) {
|
||||
|
|
@ -12,10 +12,16 @@ export function SectionHeading(props: {
|
|||
<span data-slot="heading-anchor" aria-hidden="true">
|
||||
#
|
||||
</span>
|
||||
{props.title}.
|
||||
{props.title}
|
||||
{props.description ? "." : ""}
|
||||
</a>
|
||||
</strong>{" "}
|
||||
<span>{props.description}</span>
|
||||
</strong>
|
||||
{props.description && (
|
||||
<>
|
||||
{" "}
|
||||
<span>{props.description}</span>
|
||||
</>
|
||||
)}
|
||||
</>
|
||||
)
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue