html页面图形绘制

原创 2013年12月04日 14:09:56

最近做地图的一些应用,应用到了图形绘制,头好大啊,刚开始完全不懂vml和svg,做了一阵子,发现了几个窍门:

1、IE浏览器

IE9以下均采用vml

            IE7木有任何问题,但IE8直接不显示。

            查了半天的原因,最后发现是v\:* {BEHAVIOR: url(#default#VML);}没有生效,无奈之下,只好加上

             v\:rect{
BEHAVIOR:url(#default#VML);
}
v\:oval{
BEHAVIOR:url(#default#VML);
}
v\:shape{
BEHAVIOR:url(#default#VML);
}
v\:stroke{
BEHAVIOR:url(#default#VML);
}
v\:fill{
BEHAVIOR:url(#default#VML);
}

          最终才把问题解决了

        IE9及以上均采用svg

IE上木有发现有什么问题

2、谷歌、火狐浏览器

       采用svg

              由于地图可拖动,svg有时候不能够把整个屏幕铺满,导致绘制的图形不能显示完整。后来才用了移动svg位置的方式,使得svg一直铺满整个地图。

     可这样会导致绘制的图形不能随着地图拖动移动,后面看开源gisAPI,发现人家都在绘制的rectangle外面包了两层g。我加上g后直接无法显示绘制图形了。。。

     查了半天,才发现自己创建节点的时候出问题了,js创建svg元素:

document.createElementNS('http://www.w3.org/2000/svg','svg');

      js创建g标签:

document.createElementNS('http://www.w3.org/2000/svg','g');

     最后再将图形元素append到创建的g标签内,这样,就可以完整的显示绘制的图形了。

matlab图形绘制

1.离散数据以及离散函数 当把两个向量数组在直角坐标系中用点序列来表示时,就实现了离散函数的可视化。这些图像上的离散数列反映的是X所限定的有限点或者是有限区间上的函数关系,matlab是无法实现对无...
  • Enjolras_fuu
  • Enjolras_fuu
  • 2017年01月01日 18:56
  • 469

图形绘制管线的学习笔记

什么是管线?管线,它用于描述一种过程,该过程可能涉及两个或者多个独特的阶段。这是摘自《OpenGL超级宝典》中的说法。         在《实时计算机图形学》一书中,将图形绘制管线分为三个主要阶段:应...
  • Haohan_Meng
  • Haohan_Meng
  • 2014年02月01日 00:34
  • 2418

Android图形绘制之——简单的几何图形

1.自定义view 2.重写onDraw()方法 3.xml中引用: 自定义view代码: public class MyView extends View{ public MyV...
  • lvmingci
  • lvmingci
  • 2017年02月27日 17:51
  • 117

简单几何图形绘制总结

D2D图形分类 Direct2D支持多种类型的几何图形,包括 Simple Geometry(简单几何图形) 矩形圆角矩形椭圆 Path Geometry(路径图形) Composite...
  • m0_37343248
  • m0_37343248
  • 2017年02月01日 17:31
  • 329

Java Graphics 图形绘制

Graphics类提供基本绘图方法,Graphics类提供基本的几何图形绘制方法,主要有:画线段、画矩形、画圆、画带颜色的图形、画椭圆、画圆弧、画多边形、画字符串等。 画线段 drawLine...
  • zengxiantao1994
  • zengxiantao1994
  • 2016年10月26日 20:30
  • 3095

java 2D图形绘制

package jisuan;import java.awt.Dimension; import java.awt.EventQueue; import java.awt.Graphics; impo...
  • qq_34886018
  • qq_34886018
  • 2017年10月19日 15:14
  • 99

图形绘制

原创文章,转载请注明出处:http://blog.csdn.net/zhy_cheng/article/details/8480048 图形绘制的话,在cocos2d-x自带的TestCpp里有...
  • fuqiang3270
  • fuqiang3270
  • 2014年04月30日 17:54
  • 150

真实感图形的绘制

1.卡梅隆却是启用GPU最新的渲染技术,使用显卡渲染.他还指出,相比传统的cpu渲染,效率提高了好多倍.皮克斯动画公司也有相关类似的技术,皮克斯渲染器.实际上avatar这种渲染技术是基于皮克斯渲染器...
  • u013467442
  • u013467442
  • 2014年12月18日 20:01
  • 3818

.NET下的图形绘制控件

图形图表的可视化数据表现形式已成为一种趋势。因为图表能直观的展示信息、对比和趋势等,所以许多项目开发中都需要用到图表控件,而很多图表控件都是在.NET平台下开发的,下面是做得比较好的10款图形图表控件...
  • qq_27825451
  • qq_27825451
  • 2017年11月22日 20:02
  • 67

基于SVG的web页面图形绘制API介绍及编程演示

SVG的全称是可扩展的矢量图形跟传统的Raster方式的图形(JPG, PNG, GIF等)有很大的差别,下面与大家分享下JavaScript中SVG API编程演示,感兴趣的朋友可以参考下哈...
  • fuqinyijiu
  • fuqinyijiu
  • 2014年11月20日 16:15
  • 1628
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:html页面图形绘制
举报原因:
原因补充:

(最多只允许输入30个字)