Когда я говорю, что я картограф, некоторые люди спрашивают меня, рисую ли я карты. Ради интереса я отвечаю, что делаю, но на самом деле я создаю только веб-карты… так что ручка и бумага/блокнот для рисования не нужны. Однако в последнее время я расширил искусство картографии и попытался воссоздать внешний вид старого 3D-наброска города (правда, с помощью ArcGIS API for JavaScript!). Посмотрите на результат ниже, он выглядит как нарисованный от руки, верно? Нажмите на изображение, чтобы открыть интерактивную трехмерную веб-сцену, где вы можете перемещаться, масштабировать и наклонять!
В этом сообщении в блоге я покажу вам, как вы можете загрузить и визуализировать свой собственный город с помощью этого стиля скетча (без использования JavaScript) и как я создал приложение (с использованием JavaScript).
Итак, как вы можете нарисовать свой город?
Если у вас нет 3D-модели вашего города, поищите в Живом атласе существующие веб-сцены городов. Получите элемент id веб-сцены и загрузите приложение с id в качестве параметра URL. Например, если вы хотите просмотреть веб-сцену с id из 9eea926653b84bc093760d4b08d84190, загрузите приложение следующим образом: https://ralucanicola.github.io/JSAPI_demos/sketch-the-city/index.html?id=9eea926653b84bc093760d4b08d84190 .
Если вы не нашли веб-сцену своего города в Living Atlas, попробуйте узнать, есть ли в вашем городе портал открытых данных, где опубликованы 3D-модели зданий.
Если у вас есть 3D-модель зданий, опубликуйте ее как слой сцены в ArcGIS Online. Взгляните на эту замечательную запись в блоге от Russ о том, как публиковать слои сцен в ArcGIS Online. После того, как ваш слой сцены запущен и запущен, перейдите в SceneViewer и создайте веб-сцену, содержащую слой сцены. Вот краткое руководство о том, как создать веб-сцену с помощью SceneViewer. Совет: добавьте несколько слайдов на веб-сцену, чтобы отметить достопримечательности вашего города. Они будут отображаться следующим образом:
После сохранения веб-сцены используйте элемент веб-сцены id в качестве параметра URL: https://ralucanicola.github.io/JSAPI_demos/sketch-the-city/index.html?id=your_webscene_id.
Мне бы очень хотелось увидеть, как выглядит 3D-скетч вашего города, так что просто опубликуйте изображение или ссылку в Твиттере 🙂
Вот несколько скриншотов городов, которые я визуализировал с помощью приложения Sketch the city:
Триумфальная арка и Эйфелева башня, Париж
Эмпайр Стейт Билдинг, Нью-Йорк
Берлинский дворец и Александерплац, Берлин
Как вы можете создать эту визуализацию?
Вот 3 шага, которые мне понадобились для создания старого стиля холста:
› Установите средство визуализации с краями эскиза на уровне сцены.
SceneLayers рисуются с краями эскиза и полупрозрачными белыми гранями. Это рендерер, который я применяю к каждому SceneLayer в WebScene:
› Установить фоновое изображение
Я установил фоновое изображение с текстурой старой бумаги на документ body. С SceneView с прозрачным фоном здания будут выглядеть так, как будто здания нарисованы на старом холсте.
Установка следующего CSS для тела заставляет изображение покрывать всю область тела, отображаемую на экране:
›Установите прозрачный фон в SceneView
Я хочу сделать фон SceneView прозрачным, чтобы отображалось фоновое изображение, которое я только что установил. Для этого я отключил атмосферу и звезды и установил прозрачность фона на 0. alphaCompositingEnabled также должно быть установлено на true во время инициализации:
И это была основная суть приложения.
Если вам интересно, посмотрите код приложения на Github. В противном случае просто поэкспериментируйте с приложением Sketch the city.
Получайте удовольствие от 3D-рисования!
Первоначально опубликовано на www.esri.com автором Raluca Nicola.
