`
javapolo
  • 浏览: 131574 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

fusionchart for iphone with svg

 
阅读更多
1.让你的fusionchart以svg的形式跑在未安装flash的浏览器上
How do I render charts using JavaScript (without Flash) & in iPhone/iPod/iPad?
FusionCharts using JavaScript :
FusionCharts XT allows you to create JavaScript based charts (sometimes also referred to as HTML5/Canvas charts on the web). This feature allows you to create charts in web browsers where Flash Player is not supported e.g. in iPhone/iPad. FusionCharts internally makes use of Highcharts library to generate JavaScript based charts.

This feature works seamlessly with the current implementation mode of FusionCharts i.e., you do not need to write any additional code to implement this. FusionCharts.js JavaScript class automatically detects devices where Flash is not supported and renders JavaScript based charts instead. You can also ignore Flash and only use JavaScript for charting.

How it Works?
FusionCharts XT features a completely new FusionCharts JavaScript class. FusionCharts JavaScript class now consists of four main files: FusionCharts.js, FusionCharts.HC.js, FusionCharts.HC.Charts.js and jquery.min.js. These four files are present in Download Pack > Charts folder.

You would only need to include FusionCharts.js in your web page (however, do not forget to copy the rest of files to your web application). The rest of the JavaScript files will be automatically loaded on-demand by FusionCharts.js.
Once FusionCharts class determines that Flash player is not available in the device, it automatically switches the rendering mode to JavaScript. If you wish to render the chart as JavaScript by default, you can do this by setting the rendering method to JavaScript from your code.

Let's look at code where both Flash and JavaScript rendering is enabled, with JavaScript rendering only coming into effect where Flash Player is not available:

<html> <head> <title>My First chart using FusionCharts - Using JavaScript</title> <script type="text/javascript" src="FusionCharts/FusionCharts.js"></script> </head> <body> <div id="chartContainer">FusionCharts will load here!</div><script type="text/javascript"><!-- var myChart = new FusionCharts("FusionCharts/Column2D.swf", "myChartId", "400","300", "0", "1" ); myChart.setXMLUrl("Data.xml"); myChart.render("chartContainer"); // --> </script> </body> </html>



Explicitly render JavaScript only charts :

If you wish to render JavaScript charts only, you just have to add a line of code as shown below:

FusionCharts.setCurrentRenderer('javascript')
This code will ask FusionCharts renderer to skip Flash rendering and create pure JavaScript charts.

This setting gets applied to all the charts rendered after this line. Hence, if you declare this at the beginning, all the charts in the page will rendered using JavaScript. You would not need to declare the same for each chart in the page.
The modified code will look like the following:

<html> <head> <title>My First chart using FusionCharts - Using pure JavaScript</title> <script type="text/javascript" src="FusionCharts/FusionCharts.js"></script> </head> <body> <div id="chartContainer">FusionCharts will load here!</div> <script type="text/javascript"><!-- FusionCharts.setCurrentRenderer('javascript'); var myChart = new FusionCharts( "FusionCharts/Column2D.swf", "myChartId", "400","300", "0", "1" ); myChart.setXMLUrl("Data.xml"); myChart.render("chartContainer"); // --> </script> </body> </html>

fusionchart上要跑仪表盘,记得添加FusionWidgets XT下的FusionCharts.HC.Widgets.js
分享到:
评论

相关推荐

    Using SVG with CSS3 and HTML5 Vector Graphics for Web Design azw3

    Using SVG with CSS3 and HTML5 Vector Graphics for Web Design 英文azw3 本资源转载自网络,如有侵权,请联系上传者或csdn删除 本资源转载自网络,如有侵权,请联系上传者或csdn删除

    html5 svg线条动态绘制iphone边框动画效果

    在这个项目中,开发者使用SVG的路径(Path)元素来定义iPhone边框的形状。路径由一系列的指令和坐标组成,如M(移动到)、L(直线到)、Q(二次贝塞尔曲线到)等,这些指令共同描绘出iPhone的轮廓。通过JavaScript...

    Building Web Applications with SVG

    想使用SVG开发出酷炫的web应用吗,想快下

    Using SVG with CSS3 and HTML5

    With this practical guide, you’ll learn how to use SVG not only for illustrations but also as graphical documents that you can integrate into complex HTML5 web pages, and style with custom CSS....

    全国各省市SVG地图 全国各省市SVG地图

    全国各省市SVG地图全国各省市SVG地图全国各省市SVG地图全国各省市SVG地图全国各省市SVG地图全国各省市SVG地图全国各省市SVG地图全国各省市SVG地图全国各省市SVG地图全国各省市SVG地图全国各省市SVG地图全国各省市SVG...

    svg icons for web design

    SVG图标在网页设计中的应用与优势 SVG(Scalable Vector Graphics)是一种基于XML的矢量图像格式,它在Web设计领域中扮演着至关重要的角色。SVG图标因其独特的特性和优势,被广泛用于创建清晰、可缩放且高质量的...

    Matlab下输出SVG图的工具包plot2svg

    在MATLAB环境中,有时我们需要将绘制的图形导出为高质量的图像格式,SVG(Scalable Vector Graphics)就是这样一种理想的格式。SVG是一种基于XML的矢量图像格式,它支持缩放而不失真,适合用于网页、打印和其他需要...

    creating SVG with illustrator CS2

    ### 创建SVG文件格式介绍 SVG(Scalable Vector Graphics)是一种基于文本的图形语言,它以XML(可扩展标记语言)为基础,并集成了其他标准,如CSS(层叠样式表)、DOM(文档对象模型)以及SMIL(同步多媒体集成...

    glide加载和下载svg矢量图片

    SVG(Scalable Vector Graphics)是一种矢量图格式,与传统的位图图像不同,SVG图像可以无损缩放,不会因为放大而出现像素化。在Android应用中,使用SVG可以提供高质量的图标和图形,尤其适用于多种屏幕尺寸和分辨率...

    SVG.rar_svg_svg 源代码_svg c++

    SVG,全称Scalable Vector Graphics,是一种基于XML的矢量图像格式,广泛应用于网页设计、软件开发和图形用户界面中。SVG图像以其清晰的分辨率和无限缩放性而受到青睐,尤其在需要高质量图形输出或者需要进行动态...

    c/c++ svg转png, svg文件渲染例子

    SVG(Scalable Vector Graphics)是一种基于XML的矢量图像格式,它支持无限的缩放而不失真,广泛用于图标、图形设计和网页元素。然而,SVG文件在某些场合可能不被支持,这时就需要将其转换为像素图格式,如PNG。本篇...

    svg转css,css转svg,svg与css互相转换并压缩

    在Web应用开发中,SVG(Scalable Vector Graphics)和CSS(Cascading Style Sheets)是两种关键的技术,用于创建图形和布局。SVG是一种基于XML的矢量图像格式,能够提供高质量、可缩放的图形,而CSS则用于定义网页的...

    dxf转svg,svg转png

    标题提到的“dxf转svg,svg转png”涉及两种不同的转换过程,都是图形文件格式之间的转换。DXF(Drawing Exchange Format)是AutoCAD用于二维绘图的数据交换格式,SVG(Scalable Vector Graphics)是一种基于XML的矢量...

    SVG.zip_SVG 仿真模型_SVG模型仿真_svg 仿真_svg 无功_无功仿真

    SVG,全称Scalable Vector Graphics,是一种基于XML(可扩展标记语言)的二维矢量图形格式。在IT行业中,SVG被广泛应用于网页设计、软件开发以及嵌入式系统,因为它能够提供高质量的图像,同时文件大小相对较小,且...

    SVG_SVG仿真_svg_psim_

    SVG,全称Scalable Vector Graphics,是一种基于XML的矢量图像格式,广泛应用于网页设计、软件开发和图形用户界面中。它能够无损地缩放图像,保持清晰度,而不像位图那样会失真。SVG图像由一系列几何形状(如线条、...

    svg地图制作教程(可以自己制作想要的svg地图);中国各省svg地图;四川各市svg;

    SVG(Scalable Vector Graphics)是一种基于XML的矢量图形格式,它被广泛应用于网页设计、数据可视化和地图制作等领域。SVG地图具有清晰度高、缩放不失真、占用存储空间小等优点,尤其适用于需要交互式操作和动态...

    12个SVG Loading图标

    SVG(Scalable Vector Graphics)是一种基于XML的矢量图像格式,它被广泛应用于网页设计、移动应用和软件开发中,因为SVG图标可以无损缩放,无论放大多少倍都不会出现像素化的现象。在给定的资源包"12个SVG Loading...

Global site tag (gtag.js) - Google Analytics