AnyChart图表个人总结.doc

AnyChart图表个人总结1、AnyChart介绍AnyChart是一种先进的基于flash的数据可视化的解决方案，是用于构建复杂报表的理想工具，AnyCharts使用XML作为通用数据接口，这样我们就能够从任何数据源中使得数据可视化。AnyChart是完全跨浏览器和跨平台的。很多种理由让你选择AnyChart解决方案：（1）图表好看、动画；（2）交互性强；（3）跨平台；（4）不需要安装、基于XML技术。接下来看一个具体的简单的图表（图1）：图1、水平直方图2、AnyChart数据的设置2.1获得数据（getData）AnyChart通过配置XML文件获得任何数据源的数据。举例： 用来存数据的，序列：数据集，单条数据。2.2用csv_datacsv数据： 使用这个数据： 3、AnyChart实现一个简单图表实现一个简单的图表，需要建一个工程，目录可如下：其中需要一个swf文件，一个js文件，一个html文件，一个xml文件。swf文件主要是用来解析xml文件的数据格式生成图表，AnyChart提供了很多种的swf文件。js文件用来处理html数据的一些解析和一些数据操作的处理，AnyChart提供了一个AnyChart.js文件。xml文件：实现数据的可视化。html文件：显示图表的网页。具体的实现代码：可参考官方网站提供的事例。4、图表的基本类型图表的基本类型主要大类有：折线图，散点图，堆积图，饼状图和圆圈图，气泡图，锥形图和漏斗图，热区图，雷达图，极性图。折线图有：面积图（Area Chart）、条线图（Bar Chart、Line Chart）、圆柱图（Column Chart）、圆锥图（Cone Chart）、圆筒图（Cylinder Chart）、金字塔图（Pyramid Chart）、标记图（Marker Chart）、散点图有：散射线图（Scatter Line）、分散气泡图（Scatter Bubble）、堆积图有：按百分比堆积图和按值堆积图（Percent Stacked Chart 和 Stacked Chart）饼状图和圆圈图有：Pie/Doughnut Chart气泡图有：Bubble Chart漏斗图和锥形图有：Funnel/ Pyramid Chart热区图有：HeatMap Chart和TreeMap Chart雷达图和极性图有：Radar Chart 和Polar Chart这些图表都有共性：基本上都有轴，有序列，能够设置轴的一些属性（像方向，是否倒置，最大值和最小值），能够设置风格（Styles），标签，提示工具、用标记，用色彩调色板，用填充和填充调色板。都能设置多序列数据和图例。4.1 Area Chart面积图由轴和序列数据构成，一个轴是数字轴，一个轴是分类轴。具体实现是：其中type为Area，就能建立一个面积图，type可为Area、SplineArea，SplineArea是样条面积图。也可以这样建立一个面积图：通过设置轴（Axis）的设置：可设置轴的方向，是否倒置，最大值和最小值。面积图可设置风格（Styles），标签，提示工具、用标记，用色彩调色板，用填充和填充调色板。注意：轴的设置，风格设置，标签和提示工具，标记，色彩调色板，填充和填充调色板，后面距离说明。4.2 Bar Chart 和 Column Chart考虑用条形图时：（1）轴标签是长的；（2）表示的值是继续时间的。条形图和柱状图的主要区别是：条形图是水平的，柱状图是垂直方向的。条形图和柱状图：也是由轴和序列数据构成，轴也是一样的，建立一个他们，设置为：，设置type为Bar，水平的则为条形图，垂直的则为柱状图，具体的设置：，其中plot_type设置值的不同，可设置水平和垂直的，CategorizedHorizontal和CategorizedVertical分别为水平和垂直的，同时也可以像面积图一样设置成：也可以。条形图和柱状图还设置成3D图的，设置中enable_3d_mode的值为true就行。还能设置包含Z轴的3D图，在设置包含Z轴的3D图时要注意：除了设置，还要记得设置：条形图和柱状图也能设置轴的一些属性，能调整条形之间的距离和条形组之间的距离：通过设置子节点中的point_padding和group_padding的大小调整。条形图和柱状图同样能设置风格（Styles），标签，提示工具、用标记，用色彩调色板，用填充和填充调色板。4.3 Bubble Chart气泡图：两轴和序列数据，其中两轴可为：一数值轴，一分类轴，就是折线图；当两轴都是数值轴时，也就变成了分散图，也就是分散气泡图。建立一个气泡图：设置中type为Bubble，其中y值代表数字轴上的位置，size为气泡大小。其中可设置气泡的控制大小，具体设置在中子节点中的maximum_bubble_size和minimum_bubble_size的值。有时候可能气泡之间能造成一个气泡遮住了另一个气泡（也就是气泡重叠），为了防止气泡重叠，可设置：气泡图同样能设置风格（Styles），标签，提示工具、用标记，用色彩调色板，用填充和填充调色板，轴。4.4 Cone Chart、Cylinder Chart 和 Pyramid Chart他们同样也是由两轴（一个数字轴，一个分类轴）和序列数据构成。建立：设置，其中shape_type为Cone、Cylinder、Pyramid，则分别为圆锥图、圆筒图和金字塔图。他们能设置3D的（参考条形图的设置），还能设置堆积图（下面再说明）。他们同样能设置风格（Styles），标签，提示工具、用标记，用色彩调色板，用填充和填充调色板，轴。4.5 Japanese Candlestick Chart和Open High Low Close (OHLC) Chart烛台图和高低图：同样两轴和序列数据。主要使用情况在股票的一些图中。建立：设置则为烛台图，则为高低图。他们中有几个属性：open, high, low, close。他们同样能设置风格（Styles），标签，提示工具、用标记，用色彩调色板，用填充和填充调色板，轴。4.6 Line Chart线条图：同样两轴和序列数据。建立：设置。其中type可设置两值：Line，Spline，StepLineForward和StepLineBackward。其中设置StepLineForward和StepLineBackward两者的区别是：图表的显示不同，下图中左边是StepLineForward图，右边是StepLineBackward图，也就是StepLineForward图中线是从前往后连的线，StepLineBackward图中的线是从后往前连的线。同样，线条图也能设置风格（Styles），标签，提示工具、用标记，用色彩调色板，用填充和填充调色板，轴。4.7 Marker Chart标记图：两轴和序列数据建立：。同样，标记图也能设置风格（Styles），标签，提示工具、用标记，用色彩调色板，用填充和填充调色板，轴。4.8 Stacked Chart堆积图：其中有按百分比堆积，数值堆积的面积堆积图/条形堆积图/柱状堆积图，主要是在基本图的基础上堆积的。设置中的mode为PercentStacked，则为按百分比堆积，mode为Stacked，则为按值堆积。同样堆积图也能设置风格（Styles），标签，提示工具、用标记，用色彩调色板，用填充和填充调色板，轴。4.9 Pie/ Doughnut Chart饼状图和环形图：考虑用单一饼状图和环形图的情况：(1)只有一组数据；（2）没有数据值为负；（3）数据没有为0的；（4）数据类别不要太多（不要大于7个）；（5）数据类别是整体的部分。建立：设置其中，plot_type为Pie时为饼状图，plot_type为Doughnut时为环形图。Pie/Doughnut能够设置成3D的，同样也能设置风格（Styles），标签，提示工具、用标记，用色彩调色板，用填充和填充调色板。4.10 Range Chart变化范围图：主要有：变化区域范围图和变化柱状/条状/圆筒范围图。建立：设置，其中type为RangeArea时为区域范围变化图，type为RangeSplineArea时为区域齿状范围变化图；同时设置时为线条范围变化图， 其中shape_type为不同的值，则为不同的范围变化图，其中shape_type可选值：Box 和Cylinder。变化范围图：具体的还有一些设置中的子节点和。4.11 Scatter Chart分散图：两轴（不过两轴都是数值轴）和序列数据。有散射线图、分散气泡图和分散标记图。建立：设置其中plot_type为Scatter则为分散图，具体到某种形状的图，要设置：，type可为：Line，Bubble，Marker，其中中x，y都是数值。同样分散图也能设置轴，运用标签和提示工具。4.12 Funnel Chart漏斗图：两轴和序列数据建立：设置，plot_type为Funnel，其中中有以下几个属性：neck_height，min_width，padding，min_point_size，fit_aspect，inverted，这些参数的具体使用请查看AnyChart官方手册中漏斗图那一章节，为3D时还有一个mode（方还是圆）属性设置。漏斗图同样可设置成3D，可使用标签和提示工具，可设置轴。4.13 HeatMap和TreeMap热区图和树图：两轴和序列数据。建立：设置，plot_type不同，则为不同的图，可为：HeatMap和TreeMap。同样其他可设置的部分和大多数图表一样。热区图：以特殊高亮的形式显示访客热衷的页面区域和访客所在的地理区。树图：树图显示矩形数据层次结构，树的每一个分支是一个树，然后跟较小的矩形树组成一个树图，矩形的叶节点面积表示数据的维度。4.14 Radar Chart 和Polar Chart雷达图雷达图是财务分析报表的一种。即将一个公司的各项财务分析所得的数字或比率，就其比较重要的项目集中划在一个圆形的固表上，来表现一个公司各项财务比率的情况，使用者能一目了然的了解公司各项财务指标的变动情形及其好坏趋向。雷达图主要应用于企业经营状况收益性、生产性、流动性、安全性和成长性的评价。极性图极性图上的点坐标表示到原点的距离和轴的夹角，具体的一些东西参看官方手册。雷达图和极性图：两轴和序列数据。建立：设置，其中plot_type为polar为极性图，为radar则为雷达图。在可设置图表的半径（radius）、开始角度，雷达图可设置使用极坐标。两图可惊醒x轴，y轴的一些设置，同样也能使用标签，提示工具等其他。其中极坐标：在平面内取一个定点O，叫极点，引一条射线Ox，叫做极轴，再选定一个长度单位和角度的正方向(通常取逆时针方向)。对于平面内任何一点M，用表示线段OM的长度，表示从Ox到OM的角度，叫做点M的极径，叫做点M的极角，有序数对 (,)就叫点M的极坐标，这样建立的坐标系叫做极坐标系。5、测量仪表测量仪表有圆形，水平，垂直行三种，主要包含轴，指针。测量仪表大致效果图如下：可设置轴：轴角度（开始角度和角度范围），刻度标尺，轴标签（可自定义轴标签），轴刻度，颜色变化范围，刻度线，标尺线和标尺条，多轴。设置指针（Pointers）：指针形状有标记指针，块状指针和条状指针，具体设置：，type可为：needle，knob和marker。特殊标签的设置，标签的节点结构：ByPoint框架的设置：测量仪的位置设置和调整。6、仪表板效果图：建立：Horizontal Split Layout Sample其中中type设置为dashboard。仪表板布局设置：或者，模板布局有：2x2,3x3格子，1x3立式面板。7、轴轴基本设置（可设置多轴）：定义轴，标题，位置，标签，轴刻度线和零刻度线，刻度，网格（Grids）定义轴：设置标题：设置轴的位置：设置轴标签：设置轴刻度线和零刻度线：上面主要设置了刻度线的颜色。设置刻度：其中major_tickmarks：最大刻度，minor_tickmarks：最小刻度。设置网格：其中major_grid：最大网格，minor_grid：最小网格。设置刻度值：其中用来设置刻度值类型的。轴还有一些设置：设置时间轴，自定义标签，自定义区域。8、标签和提示工具提示工具和格式化Seriesname:%SeriesNamePointname:%NamePointvalue:%YValue其中能够自定义一些属性值。标签和格式化：和提示工具差不多%Name/%YValue9、基本的外观设置主要从以下几个方面进行设置：图表背景、线和边、图表标题、字体、效果、色彩管理、调色板。设置背景：子节点, , , 和这些节点进行设置。具体：设置线和边：边设置：线设置：其中中还有其他的属性：thickness，opacity等。字体设置：效果设置：色彩管理：不同形式的色彩展示，通过设计，展示不同效果的色彩。调色板：简单的例子：其中中type值有几个值可供选择，调色板可设置梯度值（gradient）10、模板和风格模板生成模板