1. A concise explanation of the problem you’re experiencing.
Hello everyone. I have a couple of problems with geoJson. The first is that once charged, depending on the zoom level they look bad. I use the ellipsoid WGS84, without elevations. (PHOTO 1)
The other problem I have is the issue of picking. I have the option to click on the 3d tiles (buildings) and Infobox opens with the information. When I step over the buildings with the mouse without clicking, I get the cadastral reference. The problem comes when (through buttons) I load everything, geoJson and 3dTiles. The error console sends me the following message i the cadastral reference -REFCAD- appears on the geoJson, when it would only have to appear when hovering over the buildings. Here is the code:
2. A minimal code example. If you’ve found a bug, this helps us reproduce and repair it.
var extent = Cesium.Rectangle.fromDegrees(2.200423178619758, 41.427599, 2.210423178619758, 41.417599); Cesium.Camera.DEFAULT_VIEW_RECTANGLE = extent; Cesium.Camera.DEFAULT_VIEW_FACTOR = 0; //var terrain = Cesium.createDefaultTerrainProviderViewModels(); var viewer = new Cesium.Viewer('cesiumContainer', { mapProjection : new Cesium.WebMercatorProjection(), timeline: false, animation: false, baseLayerPicker: true, scene3DOnly: true, //terrainProviderViewModels: terrain, //selectedTerrainProviderViewModel: terrain[1] //shadows:true }); var edificis = new Cesium.Cesium3DTileset({ url: '../SampleData/model_bo/tileset.json' }); tileset = viewer.scene.primitives.add(edificis); edificis.show=false; var initialPosition = Cesium.Cartesian3.fromDegrees (2.200423178619758, 41.417599, 1000); var initialOrientation = new Cesium.HeadingPitchRoll.fromDegrees(21.27879878293835, -21.34390550872461, 0.0716951918898415); viewer.scene.camera.setView({ destination: initialPosition, orientation: initialOrientation, endTransform: Cesium.Matrix4.IDENTITY }); var projectes = new Cesium.GeoJsonDataSource(); projectes.load('../SampleData/projectes/treballs.geojson',{ stroke: Cesium.Color.BLACK, strokeWidth: 50, markerSymbol: '?', allowPicking: false }); var ambit = new Cesium.GeoJsonDataSource(); ambit.load('../SampleData/ambit5.json',{ stroke: Cesium.Color.BLUE, fill:Cesium.Color.GREEN.withAlpha(0.1), strokeWidth: 50, markerSymbol: '?', allowPicking: false }); Cesium.GeoJsonDataSource.clampToGround = true; viewer.scene.globe.depthTestAgainstTerrain = true; viewer.scene.enableCollisionDetection = false; var botoambit = document.getElementById('showCheckbox'); botoambit.addEventListener('change', function() { if (botoambit.checked) { // Show if not shown. if (!viewer.dataSources.contains(ambit)) { viewer.dataSources.add(ambit); } } else { if (viewer.dataSources.contains(ambit)) { viewer.dataSources.remove(ambit); } } }, false); var botoedificis = document.getElementById('showCheckbox1'); botoedificis.addEventListener('change', function() { if (botoedificis.checked) { // Show if not shown. if (!viewer.dataSources.contains(edificis)) { edificis.show=true; } } else { edificis.show=false; } }, false); var botoprojectes = document.getElementById('showCheckbox2'); botoprojectes.addEventListener('change', function() { if (botoprojectes.checked) { // Show if not shown. if (!viewer.dataSources.contains(projectes)) { viewer.dataSources.add(projectes); } } else { if (viewer.dataSources.contains(projectes)) { viewer.dataSources.remove(projectes); } } }, false); var nameOverlay = document.createElement('div'); viewer.container.appendChild(nameOverlay); nameOverlay.className = 'backdrop'; nameOverlay.style.display = 'none'; nameOverlay.style.position = 'absolute'; nameOverlay.style.bottom = '0'; nameOverlay.style.left = '0'; nameOverlay.style['pointer-events'] = 'none'; nameOverlay.style.padding = '4px'; nameOverlay.style.backgroundColor = 'white'; // Information about the currently selected feature var selected = { feature: undefined, originalColor: new Cesium.Color() }; // Information about the currently highlighted feature var highlighted = { feature: undefined, originalColor: new Cesium.Color() }; // An entity object which will hold info about the currently selected feature for infobox display var selectedEntity = new Cesium.Entity(); // Color a feature yellow on hover. viewer.screenSpaceEventHandler.setInputAction(function onMouseMove(movement) { // If a feature was previously highlighted, undo the highlight if (Cesium.defined(highlighted.feature)) { highlighted.feature.color = highlighted.originalColor; highlighted.feature = undefined; } // Pick a new feature var pickedFeature = viewer.scene.pick(movement.endPosition); if (!Cesium.defined(pickedFeature)) { nameOverlay.style.display = 'none'; return; } // A feature was picked, so show it's overlay content nameOverlay.style.display = 'block'; nameOverlay.style.bottom = viewer.canvas.clientHeight - movement.endPosition.y + 'px'; nameOverlay.style.left = movement.endPosition.x + 'px'; var name = pickedFeature.getProperty('REFCAT'); if (!Cesium.defined(name)) { name = pickedFeature.getProperty('id'); } nameOverlay.textContent = name; // Highlight the feature if it's not already selected. if (pickedFeature !== selected.feature) { highlighted.feature = pickedFeature; Cesium.Color.clone(pickedFeature.color, highlighted.originalColor); pickedFeature.color = Cesium.Color.YELLOW; } }, Cesium.ScreenSpaceEventType.MOUSE_MOVE); // Color a feature on selection and show metadata in the InfoBox. var clickHandler = viewer.screenSpaceEventHandler.getInputAction(Cesium.ScreenSpaceEventType.LEFT_CLICK); viewer.screenSpaceEventHandler.setInputAction(function onLeftClick(movement) { // If a feature was previously selected, undo the highlight if (Cesium.defined(selected.feature)) { selected.feature.color = selected.originalColor; selected.feature = undefined; } // Pick a new feature var pickedFeature = viewer.scene.pick(movement.position); if (!Cesium.defined(pickedFeature)) { clickHandler(movement); return; } // Select the feature if it's not already selected if (selected.feature === pickedFeature) { return; } selected.feature = pickedFeature; // Save the selected feature's original color if (pickedFeature === highlighted.feature) { Cesium.Color.clone(highlighted.originalColor, selected.originalColor); highlighted.feature = undefined; } else { Cesium.Color.clone(pickedFeature.color, selected.originalColor); } // Highlight newly selected feature pickedFeature.color = Cesium.Color.LIME; // Set feature infobox description var featureName = pickedFeature.getProperty('REFCAT'); selectedEntity.name = featureName; selectedEntity.description = 'Loading '; viewer.selectedEntity = selectedEntity; selectedEntity.description = '| PLAN | ' + pickedFeature.getProperty('PLAN_') + ' |
|---|---|
| DESCRIPCIO | ' + pickedFeature.getProperty('DESCRIP_12') + ' |
| PARCELA | ' + pickedFeature.getProperty('PARCELA') + ' |
| AREA | ' + pickedFeature.getProperty('AREA') + ' |
| CODI INE | ' + pickedFeature.getProperty('CODI_INE') + ' |
| COORX | ' + pickedFeature.getProperty('COORX') + ' |
| COORY | ' + pickedFeature.getProperty('COORY') + ' |
| DELEGACIO | ' + pickedFeature.getProperty('DELEGACIO') + ' |
| DATAALTA | ' + pickedFeature.getProperty('FECHAALTA') + ' |
| MASSA | ' + pickedFeature.getProperty('MASA') + ' |
| NOM_MUNICIPI | ' + pickedFeature.getProperty('NOMMUNI_1') + ' |
| NORMATIVA | ' + pickedFeature.getProperty('NORMATIV') + ' |
| NUMERO | ' + pickedFeature.getProperty('NUMERO') + ' |
| PGM | ' + pickedFeature.getProperty('PGM') + ' |
| VIA | ' + pickedFeature.getProperty('VIA') + ' |
| ZMAX | ' + pickedFeature.getProperty('Z_Max') + ' |
| ZMIN | ' + pickedFeature.getProperty('Z_Min') + ' |
