JavaScript 判断浏览器是否支持SVG的代码
可缩放矢量图形(Scalable Vector Graphics,SVG)是基于可扩展标记语言(XML),用于描述二维矢量图形的一种图形格式。SVG由W3C制定,是一个开放标准。另SVG还是Static Var Generator静止无功发生器的简称
判断浏览器是否支持SVG的代码(部分截去自Highcharts源码):
Js代码:
代码如下:
function hasSVG(){
SVG_NS = 'http://www.w3.org/2000/svg',
return !!doc.createElementNS &&
!!doc.createElementNS(SVG_NS, 'svg').createSVGRect;
}
IE8不支持SVG,所以给Highcharts图表设置legend水平位置时,设置相同的x值,Chrome与IE的显示效果不一致。因此需要判断浏览器是否支持SVG,根据不同结果,设置不同的x值。
相关推荐
-
jQuery 生成svg矢量二维码
jQuery 生成矢量svg二维码,并提供PNG,和SVG的页面下载,减轻服务端的压力. 代码如下所示: <html> <head> <title>jQuery 生成svg矢量二维码</title> </head> <body> <script type='text/javascript' src='http://cdn.staticfile.org/jquery/2.1.1/jquery.min.js'></scr
-
基于jquery和svg实现超炫酷的动画特效
今天给大家分享一款基于jquery和svg超炫的网页动画.这款动画效果非常炫.下面还有重播.慢速.和反向动画按钮.效果非常漂亮.一起看下效果图: 实现的代码. html代码: 复制代码 代码如下: <div id="intro"> <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
-
python用Pygal如何生成漂亮的SVG图像详解
前言 SVG可以算是目前最最火热的图像文件格式了,它的英文全称为Scalable Vector Graphics,意思为可缩放的矢量图形.它是基于XML(Extensible Markup Language),由World Wide Web Consortium(W3C)联盟进行开发的.严格来说应该是一种开放标准的矢量图形语言,可让你设计激动人心的.高分辨率的Web图形页面.用户可以直接用代码来描绘图像,可以用任何文字处理工具打开SVG图像,通过改变部分代码来使图像具有交互功能,并可以随时插入到
-
基于SVG的web页面图形绘制API介绍及编程演示
一:什么是SVG SVG是1999由W3C发布的2D图形描述语言,纯基于XML格式的标记语言,SVG的 全称是可扩展的矢量图形跟传统的Raster方式的图形(JPG, PNG, GIF等)有很大的差 别.SVG是2D图形开发平台,包括两个部分,一个是基于XML语言的数据描述,另 外一部分是可编程的API,其关键特性支持图形,文本,梯度填充,画笔风格,图形 特效滤镜如高斯模糊,会在稍后的代码中演示.同时还支持各种鼠标事件与DOM部 分API.几乎所有的主流浏览器都支持SVG图形格式的现实与绘制,I
-
用svg制作富有动态的tooltip
昨晚看了用svg如何制作富有动态的tooltip,于是今天就心血来潮学着做一下,于是也成功做出来,也明白其中的原理,收获颇多阿!接下来要多去学习svg,这是个好东西. 这其中也注意了一些平时纠结的细节应该怎么去做,比如: <article> <section id="sound1"> </section> <section id="sound2"> </section> </article> a
-
Python实现批量把SVG格式转成png、pdf格式的代码分享
需要提前安装cairosvg模块,下载地址http://cairosvg.org/download/ Code: #! encoding:UTF-8 import cairosvg import os loop = True while loop: svgDir = raw_input("请输入SVG文件目录") if os.path.exists(svgDir) and os.path.isdir(svgDir): loop = False
-
前端必备神器 Snap.svg 弹动效果
有人说不会 SVG 的前端开发者不叫开发者,而叫爱好者.前端不光是 Angularjs 了,这时候再不学 SVG 就晚了!(如果你只会 jQuery 就当我没说...)这里我就给大家分享一个前几天在别处看到的一个高大上的 SVG 效果,左边菜单弹出来会动动弹的说,链接点这里. 当时我就震惊了,今天抽空搞清了源码,然后下面是我潜心研究后做出来的 Demo,虽然比较粗糙,但还是很洋气的感觉呢.下面我就这个 DEMO 跟大家分享一下. http://jsfiddle.net/windwhinny/n6
-
svg动画之动态描边效果
1.首先先做一个简单的线一点一点画出来的效果,主要使用svg中的"strokeDasharray"."strokeDashoffset"属性,通过css3中的transtion改变strokeDashoffset来实现动画. 注:path中的数据通过在ai中划线后存储为svg格式就可以拿到: 效果图: 代码如下: <svg class="move_line1" xmlns="http://www.w3.org/2000/svg&q
-
Svg.js实例教程及使用手册详解(一)
什么是SVG? SVG 指可伸缩矢量图形 (Scalable Vector Graphics) SVG 用来定义用于网络的基于矢量的图形 SVG 使用 XML 格式定义图形 SVG 图像在放大或改变尺寸的情况下其图形质量不会有所损失 SVG 是万维网联盟的标准 SVG 与诸如 DOM 和 XSL 之类的 W3C 标准是一个整体 简介: SVG.js是一个轻量级的JavaScript库,允许你轻松操作SVG和定义动画. SVG(Scalable Vector Graphics,可缩放矢量图形)是基
-
推荐10 款 SVG 动画的 JavaScript 库
SVG 通常可以用作跨分辨率视频.这意味着在一块高分屏幕上不会降低图片的锐度.此外,你甚至可以让SVG动起来,通过使用一些javascript类库.下面,我们分享一些javascript类库,这些类库会帮助我们将SVG动画提高一个等级. Vivus Vivus 是一个能动画js类库,它能够给SVG图像显示出被画出来的过程.Vivus是没有其他类库依赖的(比如jQuery).你仅仅需要在页面中加入这个.js文件,然后传入需要被用来动画的SVG部分就行.同时通过指定一些配置,它能够在页面加载后直接显
随机推荐
- phpmyadmin config.inc.php配置示例
- JavaScript使用原型和原型链实现对象继承的方法详解
- Vue2几种常见开局方式详解
- 保存网页图片的八种方法
- php smarty 二级分类代码和模版循环例子
- Python中用memcached来减少数据库查询次数的教程
- 使用ASP列出NT用户组及用户
- 推荐ASP超速入门视频教程
- Docker如何同时启动多个服务
- Table冻结表头示例代码
- 第二次聊一聊JS require.js模块化工具的基础知识
- JS中判断JSON数据是否存在某字段的方法
- Mybatis 一对多和多对一关联查询问题
- 学会sql数据库关系图(Petshop)
- event.currentTarget与event.target的区别介绍
- jquery 入门教程 [翻译] 推荐
- Java中的2种集合排序方法介绍
- android如何改变editText控件中部分文字的格式
- C++实现当前时间动态显示的方法
- FlashObject之Flash的检测和嵌入Javascript脚本