12 | Документация

HTML-кастомизация

CoGIS поддерживает возможность кастомизации портала для конкретных задач. Перейдите на вкладку HTML-кастомизация , нажмите на кнопку Добавить кастомизацию , выберите необходимый тип: HTML, CSS, JavaScript и задайте соответствующие настройки (см. Рисунок 555 ):
  • Применение : по иерархии - На текущую папку, На дочерние элементы - отметьте, на какие элементы папки распространяется заданная кастомизация;
  • Опция доступна только для папок Каталога карт .
  • При выборе опции На дочерние элементы выберите, на какие конкретно вложенные элементы распространяется кастомизация - На папки , На карты , На страницы .
  • Применение : по типу клиента - В смартфоне , На планшете , На настольном компьютере - отметьте, на каких устройствах должна использоваться заданная кастомизация;
  • По умолчанию все типы устройств выбраны.
  • Место для вставки - В начало <head> , В конец <head> , В начало <body> , В конец <body> - выберите, в какое место HTML-кода страницы необходимо добавить заданную кастомизацию;
  • Код - введите код для кастомного отображения элементов картографического приложения или папки.
Рисунок 555 - Вкладка HTML-кастомизация для папки Каталога карт
Обратите внимание, что заданный код вставляется в HTML страницы, как есть. При этом для типов кастомизации CSS и JavaScript не требуется дополнительных открывающих и закрывающих HTML-тегов, при компоновке страницы теги добавятся автоматически.
В коде для обращения к конкретному элементу Каталога карт можно использовать заданный для элемента идентификатор (поле ID элемента). Пример - см. Рисунок 556 .
Для каждого настроенного типа кастомизации доступны следующие инструменты:
  • Экспорт в файл XML ;
  • Временно отключить / Включить ;
  • Удалить .

Отображение Каталога карт

Чтобы настроить другое отображение элементов Каталога карт, добавьте кастомизацию для Корневой папки . Пример кастомизации - см. Рисунок 556 .
Рисунок 556 - Пример кастомизации фона блоков Каталога карт
Использованный CSS-стиль приведен ниже:
.catalog-items-container:nth-child(2n+1) {
background-color: lemonchiffon;
}
.catalog-items-container[data-block-id="Folder_2"] {
background-color: yellowgreen;
}

Скрытие меток и линий в 3D KML моделях

В KML файлах с 3D моделями встречаются служебные метки и линии. Чтобы их скрыть можно воспользоватьсся следующим JS-скриптом:
function onCesiumKmlInit(kmlLayer) {
kmlLayer.entities.values.forEach(x => {
if (x.label) x.label.show = false;
if (x.polyline) x.polyline.show = false;
if (x.billboard) x.billboard.show = false;
});
}

Кнопка Сохранить в Карточке объекта

При необходимости можно адаптировать поведение кнопки Сохранить в Карточке объекта под конкретные задачи.
Для этого надо разместить в папке \Customer\openProject\ HTML-файл, содержащий соответствующий код.
Пример:
<script type="text/javascript">
window.checkBeforeSave = function (object, project) {
var getAttributeValue = function (attributeAlias) {
return object.attributes().keyValues.first(function (x) { return x.key == attributeAlias }).value();
};
var checkRequired = function (requiredFieldAlias, error) {
var value = getAttributeValue(requiredFieldAlias);
if (value == undefined || value == "")
return error;
return null;
};
var checkAnyCondition = function (condition, error) {
if (condition())
return error;
return null;
};
var resultErrorList = ko.observable(undefined);
var errors = [];
if (object.service.isApplicable('http://localhost/arcgis/rest/services/Test/MapServer') && object.id.layerId == 0) {
errors.addArray([
checkAnyCondition(
function () {
return getAttributeValue('Поле1') < getAttributeValue('Поле2');
},
'Поле1 должно быть больше, чем Поле2'),
checkRequired(
'Поле3',
'Поле3 обязательно')
]);
}
resultErrorList(errors.where(function (x) { return x !== null; }));
return resultErrorList;
};
</script>

Настраиваемые кнопки в Карточке объекта

В случае необходимости можно указать, отображать ли кнопки в шапке/подвале карточки объекта или не отображать.
Для этого надо разместить в папке \Customer\openProject\ HTML-файл, содержащий соответствующий код.
Пример:
window.checkButtonVisibilityInCard = function (object, button, project) {
var result = ko.observable(undefined);
if (button.caption == "Генерация отчета") {
result(false);
}
else {
result(true);
}
return result;
};
В случае необходимости можно указать, запускать ли задачу по нажатии на кнопку в шапке/подвале карточки объекта.
Для этого надо разместить в папке \Customer\openProject\ HTML-файл, содержащий соответствующий код.
Пример:
window.checkBeforeExecuteButtonInCard = function (object, button, project) {
var result = ko.observable(undefined);
if (button.caption == "Вызов задачи сервиса геообработки" && object.attributes().get("Район")() == "Центральный") {
api.showAlert("Заголовок", "Ошибка");
result(false);
}
else {
result(true);
}
return result;
};