Подробное объяснение каждого элемента конфигурации карты Echarts и данных национальной провинции и города.
Подробное объяснение каждого элемента конфигурации карты Echarts и данных национальной провинции и города.
Язык кода:js
копировать
 option: {
        backgroundColor: "#fff", // цвет холста
        //Подсказка
        tooltip: {
          backgroundColor: "rgba(255,255,255,1)",
          borderColor: "#333",
          // Подскажите текстовое содержание и стиль
          formatter: function (params) {
            console.log("2323", params.data);
            var result = "";
            result += params.data.name + "<br>";
            result += "<span>" + params.data.address + "</span><br>";
            result += "<span>" + params.data.phone + "</span><br>";
            result += "<span>" + params.data.workRule + "</span>";
            return result;
          },
        },
        //Компонент географической системы координат используется для рисования карты
        geo: [
          {
            map: "hebei", // использовать registerMap Зарегистрированное имя Зарегистрируйтесь, чтобы получить доступную карту, только на geo компонент или map Тип диаграммы
            aspectScale: 1, // Этот параметр используется scale соотношение сторон карты
            roam: false, // Разрешить ли масштабирование
            zoom: 1.1, // Коэффициент масштабирования текущей перспективы
            center: [116.692385, 39.198286], // Координаты центральной точки карты провинции Хэбэй
            layoutSize: "90%", //Размер карты поддерживает процентное отношение к ширине и высоте экрана или абсолютному размеру пикселей.
            layoutCenter: ["50%", "50%"], //карта Положение центра на экране
            label: {
              show: true, // Отображает ли карта текст региона и названия провинций и городов
              color: "#fff",
              fontSize:14,// Размер текста названия провинции и города
            },
            itemStyle: {
              // цвет области
              areaColor: {
                type: "radial", //Градиентный режим
                x: 0.7,
                y: 0.5,
                r: 0.4,
                // Изменить цвет карты эффект градиента
                colorStops: [
                  {
                    offset: 0,
                    color: "#0160AD", // 0% цвет
                  },
                  {
                    offset: 1,
                    color: "#0160AD", // 100% цвет
                  },
                ],
                global: false, // Значение по умолчанию: false
              },
              emphasis: {
                areaColor: "blue", // Цвет фона области, куда перемещается мышь.
                borderWidth: 0,
              },
              borderColor: "#FFFFFF",
              borderWidth: 1,
            },
            //Стили многоугольников и меток в выделенном состоянии.
            emphasis: {
              itemStyle: {
                areaColor: "#0160AD",
              },
              label: {
                show: 1,
                color: "#fff",
              },
            },
            // zlevel большое дело Canvas будет размещен zlevel маленький Canvas выше
            zlevel: 3,
          },
        ],
        // Информация о серии диаграмм
        series: [
          {
            type: "scatter", // График рассеяния (пузырьковый график), есть несколько типов на выбор
            coordinateSystem: "geo", // система координат  geoиспользоватьгеографиясистема координат
            symbolSize:16, // размер точки вспышки
            zlevel: 10, // Вот ключ, его надо поместить Последовательно отображать иерархию,
            // Включать ли эффект увеличения после выделения. от 5.3.2 Версия начинает поддерживать номер, используемый для установки увеличения выделения, увеличения по умолчанию. 1.1 раз
            emphasis: {
              scale: true, 
            },
            symbol:'image://' + logo, // Маркированная графика может пройти 'image://url' Установить изображение, где URL ссылка на изображение или dataURI
            itemStyle: {
              // Цвет точек можно определить по params Значение параметра можно использовать для установки цвета несовместимого цвета.
              color: function () {
                return "white";
              },
              // shadowBlur: 10,
              // shadowColor: "#333", //Графическая тень
            },
            data: [], // Данные о точках, включая широту и долготу
          },
        ],
      },

series-type

Определение

line

Линейная/площадная диаграмма

bar

гистограмма

pie

круговая диаграмма

scatter

График рассеяния (пузырьковый график)

effectScatter

График рассеяния (пузырьковый график) с анимацией волновых эффектов

radar

радиолокационная карта

tree

древовидная диаграмма

treemap

Форма визуализации «дерева данных»

sunburst

Санберст

boxplot

«Коробочный сюжет», «Коробчатый сюжет», «Коробочный сюжет», «Коробочный сюжет», «Коробочный сюжет»

candlestick

K-линейный график

heatmap

тепловая карта

map

карта

parallel

параллельная система координат

lines

карта пути

graph

Используется для отображения узлов и данных о взаимосвязях между узлами.

sankey

Диаграмма Санки

funnel

воронкообразная диаграмма

gauge

Панель управления

pictorialBar

Пиктограмма

themeRiver

тема река

custom

Пользовательская серия

json.rar
boy illustration
Неразрушающее увеличение изображений одним щелчком мыши, чтобы сделать их более четкими артефактами искусственного интеллекта, включая руководства по установке и использованию.
boy illustration
Копикодер: этот инструмент отлично работает с Cursor, Bolt и V0! Предоставьте более качественные подсказки для разработки интерфейса (создание навигационного веб-сайта с использованием искусственного интеллекта).
boy illustration
Новый бесплатный RooCline превосходит Cline v3.1? ! Быстрее, умнее и лучше вилка Cline! (Независимое программирование AI, порог 0)
boy illustration
Разработав более 10 проектов с помощью Cursor, я собрал 10 примеров и 60 подсказок.
boy illustration
Я потратил 72 часа на изучение курсорных агентов, и вот неоспоримые факты, которыми я должен поделиться!
boy illustration
Идеальная интеграция Cursor и DeepSeek API
boy illustration
DeepSeek V3 снижает затраты на обучение больших моделей
boy illustration
Артефакт, увеличивающий количество очков: на основе улучшения характеристик препятствия малым целям Yolov8 (SEAM, MultiSEAM).
boy illustration
DeepSeek V3 раскручивался уже три дня. Сегодня я попробовал самопровозглашенную модель «ChatGPT».
boy illustration
Open Devin — инженер-программист искусственного интеллекта с открытым исходным кодом, который меньше программирует и больше создает.
boy illustration
Эксклюзивное оригинальное улучшение YOLOv8: собственная разработка SPPF | SPPF сочетается с воспринимаемой большой сверткой ядра UniRepLK, а свертка с большим ядром + без расширения улучшает восприимчивое поле
boy illustration
Популярное и подробное объяснение DeepSeek-V3: от его появления до преимуществ и сравнения с GPT-4o.
boy illustration
9 основных словесных инструкций по доработке академических работ с помощью ChatGPT, эффективных и практичных, которые стоит собрать
boy illustration
Вызовите deepseek в vscode для реализации программирования с помощью искусственного интеллекта.
boy illustration
Познакомьтесь с принципами сверточных нейронных сетей (CNN) в одной статье (суперподробно)
boy illustration
50,3 тыс. звезд! Immich: автономное решение для резервного копирования фотографий и видео, которое экономит деньги и избавляет от беспокойства.
boy illustration
Cloud Native|Практика: установка Dashbaord для K8s, графика неплохая
boy illustration
Краткий обзор статьи — использование синтетических данных при обучении больших моделей и оптимизации производительности
boy illustration
MiniPerplx: новая поисковая система искусственного интеллекта с открытым исходным кодом, спонсируемая xAI и Vercel.
boy illustration
Конструкция сервиса Synology Drive сочетает проникновение в интрасеть и синхронизацию папок заметок Obsidian в облаке.
boy illustration
Центр конфигурации————Накос
boy illustration
Начинаем с нуля при разработке в облаке Copilot: начать разработку с минимальным использованием кода стало проще
boy illustration
[Серия Docker] Docker создает мультиплатформенные образы: практика архитектуры Arm64
boy illustration
Обновление новых возможностей coze | Я использовал coze для создания апплета помощника по исправлению домашних заданий по математике
boy illustration
Советы по развертыванию Nginx: практическое создание статических веб-сайтов на облачных серверах
boy illustration
Feiniu fnos использует Docker для развертывания личного блокнота Notepad
boy illustration
Сверточная нейронная сеть VGG реализует классификацию изображений Cifar10 — практический опыт Pytorch
boy illustration
Начало работы с EdgeonePages — новым недорогим решением для хостинга веб-сайтов
boy illustration
[Зона легкого облачного игрового сервера] Управление игровыми архивами
boy illustration
Развертывание SpringCloud-проекта на базе Docker и Docker-Compose