Оформление
Пользовательские карты изображений - Справка FineReport | Разработка отчетов | Использование отчетов | Учебные пособия
Индивидуальные карты изображений
1. Обзор
1.1 Ожидаемое воздействие
Встроенная картаподходит только для отображения картографической информации, но если вы хотите настроить план торгового центра, как этого добиться?

1.2 Методы реализации
Администратор заходит в платформу и создает пользовательское изображение, то есть создает границу карты, в разделе "Управление системой > Конфигурация карты". После создания границы карты необходимо использовать "Пользовательскую диаграмму" в панели управления, чтобы добиться эффекта пользовательской карты.
1.3 Описание Интранета
В интерфейсе "Конфигурация карты" необходимо запросить ресурсы API Gaode в режиме онлайн или внести в белый список следующие API карты, иначе географическая информация и пользовательские слои изображений не смогут отображаться.
- webapi.amap.com
- vdata.amap.com
- restapi.amap.com
Если пользователи не могут подключиться к внешней сети или включен белый список, вы можете поместить json-файл настроенной карты изображений, созданной в версии до 5.1.24, в соответствующий путь официального проекта (подробнее см. раздел: Ресурс настроенной карты ), и тогда вы сможете использовать эту настроенную карту непосредственно при сопоставлении географических ролей.
2. Создание пользовательских изображений
1) Администратор входит в платформу, нажимает "System Management > Конфигурация карты > Пользовательское изображение", нажимает кнопку "Добавить пользовательское изображение" в правом верхнем углу каталога, называет пользовательское изображение 2Fmarket и нажимает "ОК". Как показано на рисунке ниже:

2) Выберите только что созданный " 2Fmarket" , нажмите кнопку " Import Picture" справа и импортируйте план первого этажа торгового центра в примере. Как показано на рисунке ниже:
Примечание 1: Импортированные изображения могут иметь адаптивный размер, а также свободно масштабироваться с помощью колеса прокрутки.
Примечание 2: Размер загружаемого изображения ограничен 2M, то есть стандартным ограничением размера сообщения Tomcat, пользователи могут установить неограниченный размер изображения, см. метод настройки в главе 4 WangEditor Rich Text Control Plugin.

3) С помощьюинструмента"Рисование прямоугольника " обведите область каждого торговца и задайте название области, соответствующее номеру торговца. После того как все торговцы будут настроены, нажмите кнопку " Сохранить" в правом верхнем углу. Как показано на рисунке ниже:
Примечание: Если область, которую нужно обвести, имеет неправильную форму, то для обводки точек можно использовать инструмент "Рисование многоугольников". , и

4) Создание пользовательского образа завершено, сгенерированный JSON-файл сохраняется в каталоге %FineBI_HOME%\webapps\webroot\WEB-INF\assets\map\image, как показано на рисунке ниже:
Примечание: JSON-файлы можно напрямую копировать в другие проекты. О методах проверки файлов карт см. раздел 2.2 документа " Обновление файлов карт ".

3. Создание пользовательских карт изображений
3.1 Подготовка данных
1) Администратор входит в систему, нажимает на "Мои анализы", выбирает папку и нажимает на "Новая Analysis Subject". Как показано на рисунке ниже:

2)Нажмите "Локальный файл Excel > Загрузить данные", чтобы загрузить данные таблицы. Как показано на рисунке ниже:
Пример данных:mall custom map.xlsx

3)После загрузки нажмите кнопку "OK". Как показано на рисунке ниже:

4) Нажмите кнопку "Редактировать" в правом верхнем углу. Как показано на рисунке ниже:

5) Выберите все поля таблицы, в настройках поля установите для поля" Имя магазина " значение "Текст" и нажмите кнопку "Сохранить и обновить". Как показано на рисунке ниже:

6) Нажмите кнопку " Выход и предварительный просмотр ". Как показано на рисунке ниже:

3.2 Создание компонентов
1) Нажмите кнопку "Компоненты" в левом нижнем углу. Как показано на рисунке ниже:

2) Нажмите на кнопку выпадающего поля Shop Name и выберите "Geo Role (none) > Custom Image". Как показано на изображении ниже:

3) Выберите "2Fmarket" для настраиваемого изображения, и название магазина будет автоматически соответствовать названию области, заданному при создании границ карты. Как показано на рисунке ниже:

4) Выберите "Custom Chart" для Chart Type, перетащите 2 размерных поля, преобразованных в географические роли, на горизонтальную и вертикальную оси соответственно, и выберите "Fill Map" в выпадающем окне Graphical Properties. Как показано на рисунке ниже:

3.3 Графические свойства
3.3.1 Установка этикеток
Перетащите поле "Название магазина" на вкладку. Как показано на рисунке ниже:

3.3.2 Установка цветов
Нажмите на колонку "Цвет", чтобы задать цвет. Как показано на рисунке ниже:

3.3.3 Настройка подсказок
Перетащите поля " Бренд" и " Продукт" в поле подсказки. Как показано на рисунке ниже:

Дополнительные настройки см. в разделе Стили компонентов диаграмм, Свойства графиков.
3.4 Предварительный просмотр эффектов
3.4.1 ПК
После входа в приборную панель фактический предварительный просмотр показан ниже:

3.4.2 Мобильный
Ниже показаны результаты для приложений и HTML5:
