jQuery插件FusionCharts绘制2D双折线图效果示例【附demo源码】

前端之家收集整理的这篇文章主要介绍了jQuery插件FusionCharts绘制2D双折线图效果示例【附demo源码】前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

@H_403_0@本文实例讲述了jQuery插件FusionCharts绘制2D双折线图效果分享给大家供大家参考,具体如下:


@H_4030@

1、设计思路


@H
4030@(1)根据双折线图的特性和共性,设计出双折线图;


@H
4030@(2)设置数据源XML格式


@H
4030@

2、设计步骤


@H
403_0@(1)写出双折线引入的图类型和数据源路径


<div class="jb51code">
<pre class="brush:js;">
var doubleLine = new FusionCharts( "FusionCharts/MSLine.swf","doubleLineId","100%","540","0" );
doubleLine.setXMLUrl("doubleLine.xml");
doubleLine.render("doubleLineChart");

@H_403_0@(2)设置双折线图的数据源 doubleLine.xml:

@H_403_0@(3)引入双折线图

@H_403_0@

3、运行结果如下图:

@H_403_0@

@H_403_0@

4、源码

<Meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> FusionCharts 2D双折线图

猜你在找的jQuery相关文章