Библиотека классов для картографических приложений на основе Openlayers

Компонент Vue, представляющий собой картографическое приложение на основе библиотеки Openlayers. Встроены фрагменты карт от Baidu, Gaode, Tianditu, а также поддерживается интеграция с картографическими сервисами таких компаний, как Fang Zheng и SuperMap.

Содержит 20 компонентов, включая текстовые и графические элементы, тепловые карты, траектории и другие функции. Поддерживает интеграцию с ECharts для создания точечных диаграмм и других визуализаций на основе географического положения. Удовлетворяет общие потребности проектов.

Пользователям не требуется специальных знаний в области картографии, и им даже не нужно писать код на JavaScript для реализации общих функций.

Важные замечания

xdh-map был обновлён и интегрирован в MyUI. Репозиторий кода перемещён на https://gitee.com/newgateway/my.

Руководство по разработке

• Веб-сайт: http://newgateway.gitee.io/my/
• Руководство по разработке: http://newgateway.gitee.io/my/guide/
• Базовые компоненты библиотеки: http://newgateway.gitee.io/my/ui/components/
• Библиотека классов для картографических приложений: http://newgateway.gitee.io/my/ui/map/

Предварительный просмотр

Изображения предварительного просмотра не включены в текст запроса.

Независимое использование

Установка

npm i xdh-map --save

Глобальное использование

import Vue from 'vue'
import 'xdh-map/lib/xdhmap.css'
import * as XdhMap from 'xdh-map'
Vue.use(XdhMap)

Локальное использование

import 'xdh-map/lib/xdhmap.css'
import {XdhMap} from 'xdh-map'
export default {
 components: {
    XdhMap
  }
}

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

Установка Рекомендуется использовать npm для установки, так как он лучше интегрируется с webpack.

npm i @xdh/my --save

Быстрое начало работы Можно использовать My двумя способами:

1. Создание проекта с использованием шаблона проекта. Это рекомендуемый способ. Он предоставляет готовое решение на основе Vue.

git clone https://gitee.com/newgateway/my-web.git

Просто скачайте шаблон проекта, чтобы начать использовать все его функции.

2. Использование отдельных компонентов My. Если вам нужны только некоторые компоненты My, вы можете установить их в существующем проекте и настроить его. Шаги:

   • Установите компоненты и необходимые плагины.

   npm i element-ui @xdh/my --save

   Установите зависимости проекта.

   npm i babel-plugin-component node-sass sass-loader --save-dev
   • Настройте babel.config.js. Компоненты используют ленивую загрузку, поэтому необходимо добавить плагин в babel.config.js:

   module.exports = {
      presets: [
        '@vue/cli-plugin-babel/preset'
      ],
      plugins: [
        ...require('@xdh/my/core/babel.plugins')
      ]
    }
   • Настройте vue.config.js. Добавьте псевдоним в vue.config.js:

   module.exports = {
      transpileDependencies: ['@xdh/my'],
      chainWebpack(chain) {
        chain.resolve.alias.set('$ui', '@xdh/my/ui/lib')
      }
    }
   • Используйте компоненты. Теперь вы можете начать использовать компоненты:

   <template>
      <my-map></my-map>
   </template>
   
   <script>
      import {MyMap} from '$ui/map'
      export default {
        components: {
          MyMap
        }
      }
   </script>

Общение и взаимодействие Изображение отсутствует.