vue中marker被識別點擊的過程場景分析
1.識別點擊
1.1初始onEvent
在初始化場景的地方onEvent是與場景交互的,
我們這里就設置成當場景被點擊的方法

ak_event調(diào)用當中的方法是需要提前引入的

1.2 onEvent.js
/**
* 事件處理點擊
* 起點在init_test內(nèi)
*/
import ak_click from "./ak_click.js";
import ak_api from "../../api/ak_api.js";
var ak_event= {
/**
* 控制
*/
handler: null,
currentClickObject:null,
/**
* 初始化
*/
init:function(e){
if(e.eventtype=="LeftMouseButtonClick"){
ak_event.LeftMouseButtonClick(e);
}
},
type:1,
LeftMouseButtonClick:function(e){
window.modelId ="";
if(e.Type=="marker"){
window.modelId = e.Id
// config.modelId=e.Id;
console.log("我是marker 我的ID 是:::::"+e.Id);
ak_click.getClickObj();
return ;
}else if(e.Type=="TileLayer"){
// 該變量將作為 其他業(yè)務使用的參數(shù) 獲取期內(nèi)的objectId,坐標 范圍等參數(shù)
ak_event.currentClickObject=e;
var ObjectID=e.Id;// e.ObjectID;
console.log("我是TileLayer 信息 我即將被點擊 ");
console.log("dddddddddddddddddddddddd");
__g.tileLayer.stopHighlightActor();
if(ObjectID){
ak_click.getClickObj(e.Id);
}else{
// 如果沒有Objid 進行處理
}
}else if(e.Type=="Custom_Tag"){
// 該變量將作為 其他業(yè)務使用的參數(shù) 獲取期內(nèi)的objectId,坐標 范圍等參數(shù)
ak_event.currentClickObject=e;
var ObjectID=e.Id;// e.ObjectID;
var ss = ObjectID.indexOf("hjs");
if(ObjectID.indexOf("hjs")!=-1){
console.log("Custom_Tag:環(huán)境水:"+ObjectID);
}else if(ObjectID.indexOf("cktxp")!=-1){
console.log("Custom_Tag:窗口:"+ObjectID);
}
}
},
}
export default ak_event我們寫的js中的方法想要其他地方能引用,需要在最下面,寫
export default ak_event 每個js都是如此,ak_event是需要和js名統(tǒng)一和var 的變量名一致

這里判斷的是識別是點擊的marker還是TileLayer
if(e.Type=="marker"){
window.modelId = e.Id
// config.modelId=e.Id;
console.log("我是marker 我的ID 是:::::"+e.Id);
ak_click.getClickObj();
return ;
}else if(e.Type=="TileLayer"){
把id設置成全局變量供其他方法可使用
window.modelId = e.Id
1.3 判斷是那個marker被點擊
判斷那個marker被點擊是根據(jù)設置marker的時候id

在ak_event里面 判斷如果是marker被點擊,會進入到ak_click方法中,然后根據(jù)寫好的id前綴來判斷是那個marker被點擊,點擊后要執(zhí)行的方法,



ak_click代碼
/**
* 點擊事件的處理
*/
import ak_even from "./ak_event.js";
import ak_spjk from "../../cloud/ak_business_geodb/ak_spjk.js";
var ak_click={
obj1:null,
getClickObj:function(){
var id=modelId;
var e=id;
if(id.indexOf("MPH001")>0){
ak_mpjz.Showimagegs();
return ;
}
// 高亮選中 對象
// __g.tileLayer.highlightActor(config.currentTileLayerId, e);
if(e.indexOf("bgsb")>0){ //辦公設備
// 展示辦公電腦的 監(jiān)控情況 正常異常對比
if(e.indexOf("bgsb_dn")>0){
ak_bangong.getBgWindowsSbTj(7);
//展示辦公設備打印機的 監(jiān)控情況 正常-異常對比
}else if(e.indexOf("bgsb_dyj")>0){
ak_bangong.getBgWindowsSbTj(7);
//展示辦公設備大型打印機的 監(jiān)控情況 正常-異常對比
}
}
//視頻監(jiān)控
else if(id.indexOf("spjk")>0){
if(id.indexOf("spjk_ptsxt")>0){
ak_spjk.getIpByMid();
}
}else if(e.indexOf("yy")>0){ //預約
if(e.indexOf("yy_qhj")>0){
// 取號機的 性能監(jiān)測數(shù)據(jù)
ak_bangong.getZwAndroidSbTj(7);
}else if(e.indexOf("yy_pjq")>0){
//評價器的 性能監(jiān)測數(shù)據(jù)
ak_bangong.getZwAndroidSbTj(7);
}else if(e.indexOf("yy_jhq")>0){
//叫號器的 性能監(jiān)測數(shù)據(jù)
ak_bangong.getZwAndroidSbTj(7);
}else if(e.indexOf("yy_jhp")>0){
//叫號屏的 性能監(jiān)測數(shù)據(jù)
// ak_bangong.getZwAndroidSbTj();
}else if(e.indexOf("yy_zzj")>0){
//自助機的 性能監(jiān)測數(shù)據(jù)
ak_zichan.getSbZzjInfo();
}else if(e.indexOf("yy_cktxp")>0){
//窗口條形屏的 性能監(jiān)測數(shù)據(jù)
ak_yuyue.getckModel();
}
}else if(e.indexOf("xxfb")>0){ //信息發(fā)布
if(e.indexOf("xxfb_dp")>0){
// 大屏幕 展示輪播 視頻
ak_message.getXxfbsplb();
}else if(e.indexOf("xxfb_txp")>0){
// 條形屏幕 展示輪播 視頻
ak_message.getXxfbsplb();
}else if(e.indexOf("xxfb_zd")>0){
// 終端 展示輪播 圖片
ak_message.getXxfbtplb();
}else if(e.indexOf("xxfb_hxp")>0){
// 環(huán)形屏 展示輪播 視頻
ak_message.getXxfbsplb();
}
}else if(e.indexOf("cd")>0){ //場地
if(e.indexOf("cd_hys")>0){
// 場地 會議室
ak_field.gethysModel();
}else if(e.indexOf("cd_mj")>0){
// 場地門禁
ak_field.gethysModel();
}
}
}
}
export default ak_click;ak_spjk.js
var ak_spjk={
getIpByMid:function(){
console.log("啦啦啦啦+++++視頻監(jiān)控了"+modelId)
console.log(modelId)
}
}
export default ak_spjk;到此這篇關于vue中marker被識別點擊的過程場景分析的文章就介紹到這了,更多相關vue marker點擊內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家!
相關文章
vue?element?el-select下拉滾動加載的方法
很多朋友都遇到這樣一個問題在使用vue+element的el-select下拉框加載返回數(shù)據(jù)太多時,會造成卡頓,用戶體驗欠佳,這篇文章主要介紹了vue?element?el-select下拉滾動加載方法,需要的朋友可以參考下2022-11-11
使用element-ui +Vue 解決 table 里包含表單驗證的問題
這篇文章主要介紹了使用element-ui +Vue 解決 table 里包含表單驗證的問題,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2020-07-07
Vue+webpack+Element 兼容問題總結(小結)
這篇文章主要介紹了Vue+webpack+Element 兼容問題總結(小結),小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2018-08-08
移動端底部導航固定配合vue-router實現(xiàn)組件切換功能
經(jīng)常遇到這樣的需求,移動端中的導航并不是在頂部也不是在底部,而是在最底部且是固定的,當我們點擊該導航項時會切換到對應的組件。這篇文章主要介紹了移動端底部導航固定配合vue-router實現(xiàn)組件切換功能,需要的朋友可以參考下2019-06-06

