`

svg text参考

 
阅读更多
http://www.w3.org/TR/SVG11/text.html#TextElement

4.4 坐标的显示
    在每个<g>图层中加入onmousemove="changeText(evt)",通过javascript编写changeText(evt)函数,从而实现图形坐标的显示。
function changeText(evt)
{
   targetXtext=svgDocument.getElementById("XPos");
   targetYtext=svgDocument.getElementById("YPos");
   var XPos = evt.getClientX();
   var YPos = evt.getClientY();

   var newXPosText = svgDocument.createTextNode("X 坐标 : " + XPos);
   var newYPosText = svgDocument.createTextNode("Y 坐标 : " + YPos);
targetXtext.replaceChild(newXPosText,targetXtext.getFirstChild());
targetYtext.replaceChild(newYPosText,targetYtext.getFirstChild());
}

地图的缩放、平移和还原
function OriginView() 
{
RecordViewBox();  
var docSVG = document.HUNNUWebGIS_SVG.getSVGDocu ment();
var eSVG = docSVG.getDocumentElement();
var originView = "0 0 600 500";
eSVG.setAttribute("viewBox",originView);
分享到:
评论

相关推荐

    SVG-Text:使用 FabricJS 加载和编辑 SVG

    作为参考,它还包含 SVG 如何在 IE 中显示的图像。问题换行符不渲染到 FabricJS 画布在第一次鼠标按下/交互之前,文本不会以正确的字体显示当使用 SVG 文本的左侧/顶部位置创建 IText 时,文本位于屏幕外

    vue项目里面引用svg文件并给svg里面的元素赋值

    主要介绍了vue项目里面引用svg文件并给svg里面的元素赋值,本文分步骤通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

    SVG描边动画

    本文主要介绍了SVG描边动画的相关实例,具有很好的参考价值,下面跟着小编一起来看下吧

    使用svg实现动态时钟效果

    一个使用svg做的动态时钟,供大家参考,具体内容如下 怎么样很酷吧,以下是源码: &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;title&gt;SVG clock&lt;/title&gt; &lt;meta ...

    基于SVG的矢量图形库Kity.zip

    Kity 是一个基于 SVG 的矢量图形库,帮助你快速在页面上创建和使用矢量元素。 面向对象的接口风格在 Kity 里,所有图形,以及交换的数据,都是以强类型的对象...更详细的使用方法请参考 wiki。 标签:Kity

    CSS 文本渲染属性text-rendering的介绍和使用示例

    CSS关于文本渲染的属性text-rendering告诉渲染引擎工作时如何优化显示文本,属性text-rendering正是一个SVG属性,目前尚没有任何的CSS标准对其进行定义,本文附有示例,感兴趣的朋友可以参考下

    Geotools Java API 开发gis的参考资料

    org.geotools.svg org.geotools.test org.geotools.text org.geotools.text.filter org.geotools.util org.geotools.util.logging org.geotools.utils org.geotools.utils.coveragetiler org.geotools.utils...

    vk-qr:VK QR代码生成器库

    VK-QR JavaScript库,用于生成VK风格QR码的SVG代码。用法通过纱安装 yarn add @vkontakte/vk-qr或npm npm install @...API参考句法 generatedSvgCode = vkQr . createQR ( text [ , qrOptions ] ) ;参数text必填字符

    基于zigbee和stm32的智能家居系统源码+项目说明,上位机使用Qt编写(毕业设计).zip

    [Security Status](https://www.murphysec.com/platform3/v3/badge/1614013746192613376.svg?t=1)](https://www.murphysec.com/accept?code=69f7806ceb54b7d3e1a8a09bff768c88&type=1&from=2&t=2) ## 项目介绍 ...

    环形加载进度条封装(Vue插件版和原生js版)

    本文实例为大家分享了环形加载进度条封装代码,供大家参考,具体内容如下 1、效果预览 2、用到的知识 主要利用SVG的stroke-dasharray和stroke-dashoffset这两个属性。 在看下面文章之前,你需要了解 &lt;!DOCTYPE ...

    Readme-Icons:存储库托管各种图标和图像,供您在自述文件或其他 Markdown 文件中使用

    [text](:link) ) 或参考链接语法 ( [text]: :link ) 使用此[text]: :link ,然后在多个地方使用![text]特定版本感谢发布,您还可以为您的图标使用特定版本。 如果您的图标被更改或什至被删除,但您仍然想使用它,这...

    D3.js封装文本实现自动换行和旋转平移等功能

    之前小编和大家分享了SVG中如何配合使用text和tspan来实现换行的功能,所以这篇文章对此功能进行一下封装,以后就可以直接用了。有需要的朋友们可以参考借鉴,下面来一起看看吧。

    基于javascript实现页面加载loading效果

    本文实为大家分享了javascript实现页面加载loading效果,供大家参考,具体内容如下 效果图: &lt;html&gt; &lt;head&gt; &lt;title&gt;正在载入&lt;/title&gt; &lt;meta ...

    ScreenCaliber:基于截图开发 HTML 和 CSS 的助手

    Svg 网格演示: : SCREENCALIBER 是一个前端开发的小工具。 它有助于从屏幕截图参考开发 HTML/CSS。 我将ScreenCaliber与Firebug结合使用。 用法:在结束 &lt;/body&gt; 标签之前包含 ScreenCaliber Snippet: ...

    asp.net知识库

    技术基础 New Folder 多样式星期名字转换 [Design, C#] .NET关于string转换的一个小Bug Regular Expressions 完整的在.net后台执行javascript脚本集合 ASP.NET 中的正则表达式 常用的匹配正则表达式和实例 ...

    JAVA上百实例源码以及开源项目

    1个目标文件,JNDI的使用例子,有源代码,可以下载参考,JNDI的使用,初始化Context,它是连接JNDI树的起始点,查找你要的对象,打印找到的对象,关闭Context…… ftp文件传输 2个目标文件,FTP的目标是:(1)提高...

    JAVA上百实例源码以及开源项目源代码

    1个目标文件,JNDI的使用例子,有源代码,可以下载参考,JNDI的使用,初始化Context,它是连接JNDI树的起始点,查找你要的对象,打印找到的对象,关闭Context…… ftp文件传输 2个目标文件,FTP的目标是:(1)提高...

Global site tag (gtag.js) - Google Analytics