第28篇:自定义HTML弹窗——Cesium只管算坐标,剩下的它一概不管

发布时间:2026/10/2 13:55:06
第28篇:自定义HTML弹窗——Cesium只管算坐标,剩下的它一概不管 上回书说到,#27 那个咬着鼠标跑的小气泡,替场景工具线还了第 14 篇欠下的一笔旧账。本篇还是这条线,但换个方向——不再盯着"鼠标脚下是哪一层地面",改问另一个问题:一个绑在地球上的点位,怎么让一块 HTML 稳稳地浮在它头顶。这两件事看着像,其实是两套完全不同的算法:#27 干的是"逆向"——给你一个屏幕像素,求它是地球上哪个点;今天干的是"正向"——给你地球上某个点,求它此刻在屏幕的哪一像素。一个求逆,一个求正。而正向这件事的答案,比你想象的薄得多。今天——我们点一下地球,让一块 HTML 弹窗浮在那个点上方,然后跟着地球转。🎉我是 Cesium酱,一个在 WebGIS 圈子里摸爬滚打多年的前端,本猿。这篇写起来心情挺复杂:它大概是整个系列里"代码最短、结论最狠"的一篇——整条链路拆到底,Cesium 只做了三次矩阵乘法。本文目标:从scene.pickPosition拿到一个三维点,让一块自己写的 HTML 牢牢钉在它头顶,跟随镜头实时移动;顺手量清楚两件事——Cesium 到底替我们做了多少,以及那个看似无关紧要的scaleByDistance背后藏了什么。💪💡 本文涉及的全部代码均已开源,完整的仓库地址见文末,可自行取用、随意魔改。一、为什么"贴在地球上的一块 HTML"这么费劲先说清楚我们要的东西长什么样。在 #14 和 #27 里,坐标是

关于本文作者

来自尧图内容编辑团队

尧图内容编辑团队 内容团队

尧图内容编辑团队

本文由尧图网络内容编辑团队执笔。团队由资深项目经理、前端工程师与设计师组成,所有内容均来自亲手交付的真实项目,先讲清问题、再给出可落地的解法。尧图深耕北京网站建设十年,服务过京华建材集团、智造科技等各行业客户,把一线经验沉淀为可复用的行业观察。

  • 十年建站经验,覆盖建材、制造、服务、文创等
  • 项目经理把关选题与事实准确性
  • 工程师与设计师联合撰写专业细节
  • 统一编辑规范,保证文风与排版一致
  • 每月复盘转化数据,迭代选题方向

延伸阅读

相关资讯与近期热门内容

深度阅读推荐

建站决策前值得细读的三篇

网站改版的5个关键决策
2024-08-12

网站改版的5个关键决策

什么时候该改版、改到什么程度、如何避免流量掉光,京华建材集团改版复盘给出答案。

获取专属建站方案

看完文章,把您的行业与预算告诉我们,免费获取一份量身定制的官网建设方案与报价。

立即免费咨询