关于SVG格式图片实现室内地图

SVG格式图片

可缩放矢量图形(Scalable Vector Graphics,SVG)基于 XML 标记语言,用于描述二维的矢量图形。

作为一个基于文本的开放网络标准,SVG 能够优雅而简洁地渲染不同大小的图形,并和 CSS、DOM、JavaScript 和 SMIL 等其他网络标准无缝衔接。本质上,SVG 相对于图像,就好比 HTML相对于文本。

SVG 图像及其相关行为被定义于 XML 文本文件之中,这意味着可以对它们进行搜索、索引、编写脚本以及压缩。此外,这也意味着可以使用任何文本编辑器和绘图软件来创建和编辑它们。

绘制SVG

这里以万达广场为例,绘制一小块地图为例:

打开 Illustrator -> 新建文档 -> 矩形+文字进行地图元素的绘制。

选中这个快,Ctrl+G 对其进行编组,并修改该块最外层的图层id为 _1 。注意,必须以下划线开头,因为图片导出为SVG格式会生成 XML , 而 XML ID 必须以下划线开头。(最好用业务id进行命名,例如店铺编号)

修改后的图层信息如下:

现在多绘制几个:

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/780927.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

react学习总结(二)之案例分享

一.项目框架的搭建 1./src/pages下建不同的页面Header.jsx,About.jsx,Home.jsx, Message.jsx,News.jsx,Detail.jsx Header.jsx import React from react import { useNavigate } from react-router-domexport defau…

C++多线程:线程的创建、join、detach、joinable方法(二)

1、线程的开始与结束 程序运行起来,生成一个进程,该进程所持有的主线程开始自动运行,main主线程运行完所有的代码从main函数中返回表示整个进程运行完毕,标志着主线程和进程的死亡,等待操作系统回收资源,因…

nginx如何清理页面缓存

在 Nginx 中,清理页面缓存通常涉及配置缓存头以控制缓存行为,或者使用外部工具或机制来清除缓存。以下是一些建议来管理和清理 Nginx 的页面缓存: 配置缓存头: Nginx 本身不直接提供缓存机制,但可以通过配置 proxy_cac…

安全算法 - 国密算法

国密算法是中国自主研发的密码算法体系,包括对称加密算法、非对称加密算法和哈希算法。其中,国密算法采用SM4作为对称加密算法,SM2作为非对称加密算法,以及SM3作为哈希算法。国密算法在信息安全领域具有重要意义和广泛应用&#x…

Cocos Creator 常见问题记录

目录 问题1、精灵图九宫格,角度不拉伸 问题2、BlockInputEvents 防止透屏 问题1、精灵图九宫格,角度不拉伸 点击编辑,拖拽到可变区域 问题2、BlockInputEvents 防止透屏

【独立开发前线】Vol.26 【独立开发产品】吉光卡片-让你的文字变得酷炫起来

今天给大家分享一下 独立开发前线 社区成员张小吉 的作品 吉光卡片; 这是一款iOS的APP,下载:吉光卡片,主要功能是帮你制作酷炫的文字卡片,用精美的卡片让你的文字生动起来。 展示效果如下: 你可以用它制作…

【公示】2023年度青岛市级科技企业孵化器拟认定名单

根据《青岛市科技企业孵化器管理办法》(青科规〔2023〕1号)(以下简称《管理办法》)、《关于开展2023年度市级科技企业孵化器认定申报工作的通知》,经申报受理、区市推荐、形式审查、专家评审及现场核查等程序&#xff…

为何keil编译信息显示data使用量不是整数

在使用Keil软件进行嵌入式系统开发时,编译后显示的数据使用量(Data Usage)可能会以小数形式显示。这种情况通常是由以下几个原因造成的: 1.内存对齐:为了提高内存访问效率,编译器会对数据进行对齐处理。例…

【笔记】动⼿学深度学习(花书)|| Aston Zhang Mu Li Zachary C. LiptonAlexander J. Smola

系列文章目录 提示:这里可以添加系列文章的所有文章的目录,目录需要自己手动添加 前言 第一章 深度学习简介 第二章 P 提示:写完文章后,目录可以自动生成,如何生成可参考右边的帮助文档 文章目录 系列文章目录前言本书…

BasicVSR++模型转JIT并用c++libtorch推理

BasicVSR模型转JIT并用clibtorch推理 文章目录 BasicVSR模型转JIT并用clibtorch推理安装BasicVSR 环境1.下载源码2. 新建一个conda环境3. 安装pytorch4. 安装 mim 和 mmcv-full5. 安装 mmedit6. 下载模型文件7. 测试一下能否正常运行 转换为JIT模型用c libtorch推理效果 安装Ba…

使用docker 安装oracle 11g 挂载数据目录并修改SID centos-7

建议:建议使用其它系统去装ubuntu或Rocky(因为centos已经停止维护) 1、安装docker 这里就不细写了,可以查看清华镜像源或者阿里镜像源 清华:https://mirrors.tuna.tsinghua.edu.cn/help/docker-ce/ 阿里:ht…

2434. 使用机器人打印字典序最小的字符串

点击跳转题目 本题学到两点: 1.初始化数组,全部为0的简单写法。之前都是 int arr[26]; memset(arr,0,sizeof(arr));2.if条件中的&&部分左右顺序不能颠倒。颠倒报错,之前一直没重视。 思路: 遍历s,push当前字…

[c++]类和对象常见题目详解

本专栏内容为:C学习专栏,分为初阶和进阶两部分。 通过本专栏的深入学习,你可以了解并掌握C。 💓博主csdn个人主页:小小unicorn ⏩专栏分类:C 🚚代码仓库:小小unicorn的代码仓库&…

2024.03.19 校招 实习 内推 面经

绿*泡*泡VX: neituijunsir 交流*裙 ,内推/实习/校招汇总表格 1、校招 | RoboSense 速腾聚创2024届春招启动(内推) 校招 | RoboSense 速腾聚创2024届春招启动(内推) 2、实习 | 百度智能驾驶事业群组 202…

kanzi 3d知识点

整理学习资料 名字链接Kanzi视频合集中科创达-智能座舱视频专辑-中科创达-智能座舱视频合集-哔哩哔哩视频 (bilibili.com)Kanzi在线文档Working with … - Kanzi framework 3.9.7 documentationThe Book of ShadersThe Book of Shaders着色器语言Shader_着色语言Shading Langua…

Vim - 文本编辑器 Vi vs Vim

你是否应该在学习 Vim 之前先学习 Vi,这完全取决于您自己、您的要求以及您的具体目标和需求。Vim 是 Vi 的扩展、增强和改进版本,它包括 Vi 的所有功能以及许多附加功能。 简约: Vi 设计简约。先学习 Vi 可以让你对基础知识有扎实的了解&…

malloc是如何分配内存|malloc(1)分配多大内存|free释放内存,会还给操作系统吗?

前言 大家好, 我jiantaoyab,这篇文章给大家介绍mallo和free面试中常问到的问题。 malloc是如何分配内存的? 如果用户分配的内存小于128KB,则通过brk()申请内存 如果用户分配的内存大于128KB,则通过mmap()申请内存 简…

数据分析之POWER Piovt的KPI设置

内容总结: 1.两个表格关联不上:需要添加辅助列,建立关联 2.添加辅助列后还关联不上:将虚线变为实线 3.根据需求要增加一些度量值 4.设置KPI后,绝对值选1后设定百分比 5.在透视表里面加入KPI状态 导入所关联的数据后建立…

游戏领域AI智能视频剪辑解决方案

游戏行业作为文化创意产业的重要组成部分,其发展和创新速度令人瞩目。然而,随着游戏内容的日益丰富和直播文化的兴起,传统的视频剪辑方式已难以满足玩家和观众日益增长的需求。美摄科技,凭借其在AI智能视频剪辑领域的深厚积累和创…

SQLBolt,一个练习SQL的宝藏网站

知乎上有人问学SQL有什么好的网站,这可太多了。 我之前学习SQL买了本SQL学习指南,把语法从头到尾看了个遍,但仅仅是心里有数的程度,后来进公司大量的写代码跑数,才算真真摸透了SQL,知道怎么调优才能最大化…