Better cities and towns labels in 3D view (#635)

* Better cities and towns labels in 3D view

* Small changes (let -> const)

* Lower city labels

* Change the way the label faces the camera

* Use font from svg instead of hardcoded

* Use color from svg

* Optionalize 3d labels

* Use pack.burgs instead of svg + Icon use style from svg

* Replace jQuery with d3

* Labels adapts to height scale

* Fix bug: options are not applied when changing layer

* Add states labels + Replace canvas by svg

* Fix: States labels adapts to height scale

* Requested fixes

* All fonts working properly + Big memory optimization + Minor fixes

* Fix rotating animation + More optimization

* use Raycaster for positioning the labels

* Use canvas to render burg labels + Some tweaks

Co-authored-by: Rayzeq <zachariedubrulle@gmail.com>
This commit is contained in:
Rayzeq 2021-07-17 14:52:17 +02:00 committed by GitHub
parent 53c20a48da
commit 4575edc92e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 247 additions and 13 deletions

View file

@ -912,6 +912,7 @@ function toggle3dOptions() {
document.getElementById("options3dMeshRotationNumber").addEventListener("change", changeRotation);
document.getElementById("options3dGlobeRotationRange").addEventListener("input", changeRotation);
document.getElementById("options3dGlobeRotationNumber").addEventListener("change", changeRotation);
document.getElementById("options3dMeshLabels3d").addEventListener("change", toggleLabels3d);
document.getElementById("options3dMeshSkyMode").addEventListener("change", toggleSkyMode);
document.getElementById("options3dMeshSky").addEventListener("input", changeColors);
document.getElementById("options3dMeshWater").addEventListener("input", changeColors);
@ -928,6 +929,7 @@ function toggle3dOptions() {
options3dSunZ.value = ThreeD.options.sun.z;
options3dMeshRotationRange.value = options3dMeshRotationNumber.value = ThreeD.options.rotateMesh;
options3dGlobeRotationRange.value = options3dGlobeRotationNumber.value = ThreeD.options.rotateGlobe;
options3dMeshLabels3d.value = ThreeD.options.labels3d;
options3dMeshSkyMode.value = ThreeD.options.extendedWater;
options3dColorSection.style.display = ThreeD.options.extendedWater ? "block" : "none";
options3dMeshSky.value = ThreeD.options.skyColor;
@ -958,6 +960,10 @@ function toggle3dOptions() {
ThreeD.setRotation(speed);
}
function toggleLabels3d() {
ThreeD.toggleLabels();
}
function toggleSkyMode() {
const hide = ThreeD.options.extendedWater;
options3dColorSection.style.display = hide ? "none" : "block";