我现在要实现一个我点击这个模型上的小棍棍(像火柴一项的东西),弹出卡片显示出对应的信息(但是点击事件不生效)按照这么写点击根本不触发。不知道为甚么望指教。
var scene = viewer.scene,
// url = "http://localhost:8091/iserver/services/3D-single/rest/realspace", //三维服务地址
url2 = "http://10.25.111.179:8090/iserver/services/3D-DXGSsensor/rest/realspace/datas/CGQ26"; //数据服务地址
var promise = scene.open(config.mapCGQ);
Cesium.when(promise, function(layers) {
var layer = scene.layers.find('CGQ26'); //绑定图层,图层名称可在三维服务地址下的datas中看
layer.setQueryParameter({
url: url2,
dataSourceName: "CGQ26", //对应数据源名称,数据服务
dataSetName:"CGQ26", //对应数据集名称,数据服务
isMerge: true,
keyWord: 'SmID'
});
})
viewer.pickEvent.addEventListener(function(feature) {
alert("pickEvent事件已生效");
});
// 鼠标左击事件
handler.setInputAction(function onLeftClick(movement) {
if (!picking) return;
const pickedFeature = viewer.scene.pick(movement.position);
if (Cesium.defined(pickedFeature) &&
pickedFeature instanceof Cesium.Cesium3DTileFeature &&
pickedFeature.tileset === tileset) {
console.log(pickedFeature.id);
const dbId = getFeatureDbId(pickedFeature);
if (dbId === selectedDbId) {
clearSelected();
} else {
setSelected(dbId);
}
} else {
clearSelected();
}
}, Cesium.ScreenSpaceEventType.LEFT_CLICK);
// 鼠标右击事件-弹出菜单列表
handler.setInputAction(function onRightClick(movement) {
if (!picking) return;
console.log(movement.position);
const pickedFeature = viewer.scene.pick(movement.position);
// 3dtiles右击
if (Cesium.defined(pickedFeature) &&
pickedFeature instanceof Cesium.Cesium3DTileFeature &&
pickedFeature.tileset === tileset) {
const dbId = getFeatureDbId(pickedFeature);
var cartesian = labelEntity.cartesian;
if (Cesium.defined(cartesian)) {
menuCartesian = cartesian;
$("#menuList").css("display", "block");
$("#menuList").css("left", movement.position.x);
$("#menuList").css("top", movement.position.y);
}
}
}, Cesium.ScreenSpaceEventType.RIGHT_CLICK);
你的小棍棍 单体化gltf方式加载吧,当然3dtiles也是可以的,下面的代码是gltf方式的,高亮,与属性获取,弹窗自备:
picFeature(viewer) {
var fragmentShaderSource =
"uniform sampler2D colorTexture;\n" +
"varying vec2 v_textureCoordinates;\n" +
"uniform vec4 highlight;\n" +
"void main() {\n" +
" vec4 color = texture2D(colorTexture, v_textureCoordinates);\n" +
" if (czm_selected()) {\n" +
" vec3 highlighted = highlight.a * highlight.rgb + (1.0 - highlight.a) * color.rgb;\n" +
" gl_FragColor = vec4(highlighted, 1.0);\n" +
" } else { \n" +
" gl_FragColor = color;\n" +
" }\n" +
"}\n";
var stage = viewer.scene.postProcessStages.add(
new Cesium.PostProcessStage({
fragmentShader: fragmentShaderSource,
uniforms: {
highlight: function() {
return new Cesium.Color(1.0, 0.0, 0.0, 0.5);
}
}
})
);
stage.selected = [];
viewer.screenSpaceEventHandler.setInputAction(movement => {
var pickedFeature = viewer.scene.drillPick(
movement.position,
10,
10,
10
);
if (!Cesium.defined(pickedFeature)) {
stage.selected = [];
return;
}
if (pickedFeature.length == 0) {
stage.selected = [];
return;
}
let pickedObject = pickedFeature[0];
//f12看下你选中对象的相关属性吧
if (Cesium.defined(pickedObject) && pickedObject.id != null) {
let properties = pickedObject.id.properties.sign.getValue();
this.tname = properties.name;
this.tid = properties.id;
this.type = properties.type;
}
if (Cesium.defined(pickedObject)) {
stage.selected = [pickedObject.primitive];
} else {
stage.selected = [];
}
}, Cesium.ScreenSpaceEventType.LEFT_CLICK);
}