1 В избранное 0 Ответвления 0

OSCHINA-MIRROR/antv-l7plot-antv-l7plot

Присоединиться к Gitlife
Откройте для себя и примите участие в публичных проектах с открытым исходным кодом с участием более 10 миллионов разработчиков. Приватные репозитории также полностью бесплатны :)
Присоединиться бесплатно
Клонировать/Скачать
README.en-US.md 4.4 КБ
Копировать Редактировать Web IDE Исходные данные Просмотреть построчно История
gitlife-traslator Отправлено 30.11.2024 09:26 69fdf27

L7Plot

🌍 Библиотека для геопространственной визуализации на основе L7.

L7 — библиотека для создания диаграмм и карт.

Версия Статус

Статус релиза Состояние покрытия тестами

Веб-сайтБыстрый стартAPIПримеры

✨ Особенности

  • 📦 Из коробки: настраиваемые географические диаграммы со встроенными данными административного уровня с различной детализацией.
  • 🚀 Богатые элементы: разнообразные типы диаграмм и компоненты карт, поддержка нескольких базовых карт.
  • 💯 Простота настройки: управление данными, от чисел до форм, поддержка многослойности и наложения поверхностей на нескольких картах.
  • 🌱 Динамическое взаимодействие: мощные возможности взаимодействия с диаграммами, поддержка двух- и трёхмерной перспективы, предоставление динамического API для взаимодействия с командами.

📦 Установка

$ npm install @antv/l7 @antv/l7plot

🔨 Использование

<div id="container"></div>
import { Dot } from '@antv/l7plot';

const data = [
  { lng: 103.715, lat: 31.211, depth: 10, mag: 5.8, title: 'M 5.8 - восточный Сычуань, Китай' },
  { lng: 104.682, lat: 31.342, depth: 10, mag: 5.7, title: 'М 5.7 - восточный Сычуань, Китай' },
  // ...
];

const dot = new Dot('container', {
  map: {
    type: 'mapbox',
    style: 'light',
    center: [103.447303, 31.753574],
    zoom: 7,
  },
  autoFit: true,
  source: {
    data: data,
    parser: { type: 'json', x: 'lng', y: 'lat' },
  },
  color: {
    field: 'mag',
    value: ['#82cf9c', '#10b3b0', '#2033ab'],
    scale: { type: 'quantize' },
  },
  size: {
    field: 'mag',
    value: ({ mag }) => (mag - 4.3) * 10,
  },
  state: { active: true },
  scale: { position: 'bottomright' },
  legend: { position: 'bottomleft' },
  tooltip: {
    items: ['title', 'mag', 'depth'],
  },
});

Локальная разработка

# Глобальная установка yarn
$ npm install yarn -g

# Установка зависимостей проекта
$ yarn bootstrap

# Компиляция каждого пакета в реальном времени и запуск сборника рассказов
$ yarn dev

# Запуск веб-сайта
$ yarn dev-website

# Запустить юнит-тесты
$ yarn test

# Открыть электрон для юнит-тестов
$ yarn test-live

🤝 Как внести свой вклад

Ваши идеи всегда приветствуются! Пожалуйста, сначала ознакомьтесь с проблемами.

Чтобы стать участником, пожалуйста, следуйте нашему руководству по внесению вклада.

Лицензия

MIT

Опубликовать ( 0 )

Вы можете оставить комментарий после Вход в систему

1
https://api.gitlife.ru/oschina-mirror/antv-l7plot-antv-l7plot.git
git@api.gitlife.ru:oschina-mirror/antv-l7plot-antv-l7plot.git
oschina-mirror
antv-l7plot-antv-l7plot
antv-l7plot-antv-l7plot
main