易笔记易笔记
首页
文章
分类
标签
首页
文章
分类
标签
Claude Code 1工作流 1AI 编程 1效率工具 1LangChain 1Prompt 1Frontend 1cesium 2CSS 10iOS 1Safari 1css 1font 1typography 1ide 1JS 3Flexbox 1PHP 1ThreeJS 23D 2Vue 8Vue 3 1Composition API 1ref 1reactive 1Windows 4KMS 1Vue3 5uni-app 1Form 1Modal 1虚拟滚动 1JavaScript 1浏览器 API 1requestIdleCallback 1性能优化 2组件 1异步组件 1
Cesium:为图形添加边框

翻遍Cesium文档未能发现border相关内容,但src支持canvas格式索性通过canvas添加图片。

/**
 * 为图形添加边框
 * @param entity cesium实体
 * @param url 图片地址
 * @param color 边框颜色
 */
export const addBorderToImage = (entity, url,color = 'green') => {
  const canvas = document.createElement('canvas');
  canvas.width = entity.billboard.width
  canvas.height = entity.billboard.height
  const ctx = canvas.getContext('2d')
  let image = new Image()
  image.crossOrigin = "anonymous";
  image.width = canvas.width
  image.height = canvas.height
  image.onload = () => {
    ctx.drawImage(image,0,0, canvas.width, canvas.height)
    ctx.strokeStyle = color
    ctx.lineWidth = 6
    ctx.rect(0,0,canvas.width,canvas.height)
    ctx.stroke()
    entity.billboard.image = canvas
  }
  image.src = url
}
分类: cesium标签: cesium
日期: 3/25/2023

Cesium:向固定方向平移

/**
 * 获取移动位置
 * @param {Cesium.Cartesian3} start 开始位置
 * @param {Cesium.Cartesian3} direction 移动方向和距离
 * @returns {*}
 */
export const getMovePosition = (start, direction) => {
  return Cesium.Matrix4.multiplyByPoint(
    Cesium.Transforms.eastNorthUpToFixedFrame(
      start
    ),
    direction,
    new Cesium.Cartesian3()
  )
}
分类: cesium标签: cesium
日期: 7/22/2023