Amcharts的特点包含:

*动画或静态
*价值轴能够扭转
*线性或对数轴的价值尺度
*提前定义或定制的子弹
*定制描写叙述不论什么数据点
*点击栏目/酒吧（可用于钻孔下来图表）
*梯度弥漫
*价值指标插入式
*轴价值观内样区
*平台无关
*能够输出作为一项形象
*可控制在途经的JavaScript
*设置和数据能够通过直接从一个HTML文件
*度身定做的形象或Flash （动画）背景
*无限标签
*旋转标签及轴价值观
*数据可自己主动重装上阵与预设频率
*不论什么格式文本气球

ColumnChart

Axes   轴设置

   CategoryAxisAlpha     //x轴坐标线透明度

   CategoryAxisColor   //x轴坐标线颜色

    CategoryAxisTickLength    // x轴坐标刻度线的延长线

   CategoryAxisWidth         //x轴坐标线的厚度

    ValueAxisAlpha     //y轴（值） 坐标线透明度

     ValueAxisAlpha     //y轴坐标线颜色

     ValueAxisLogarithmic    //false 为线性刻度，true为对数刻度

Balloons   //弹出数据指示框的设置

     BalloonAlpha    //弹出框的透明度

     BalloonBorderAlpha   //弹出框边框

     BalloonBorderColor    //弹出框边框的颜色

     BalloonEnabled   // 弹出框是否可用

Column //柱状图的柱子的设置

        ColumnBalloonTextFormatString   //当鼠标移动到柱子时弹出的标签 {value} 为y轴坐标值

        ColumnBorderAlpha //柱子的边框

        ColumnDataLabelFormatString    //柱子的数据文本标签

        ColumnDataLabelTextPosition    //柱子数据标签的位置

         ColumnGradientDirection      //柱子数据标签的

        ColumnGrowEffect              //柱子的动画效果

         ColumnHoverBrightness        //指示柱子时柱子的亮暗变化

         ColumnSequencedGrow         //柱子是同一时候展示，还是一根接一根

           ColumnSpacing           //同一坐标点的柱子的间距

            Columntype                //柱子的结构

           ColumnWidth          //两个坐标点间柱子的间隔   百分比，100为没有间隔

Context Menu                 //右键菜单

           ContextMenuItems    //用户自己定义可选项

           ShowPrintContextMenu     //打印功能

            ShowZoomcontextMenu   //缩放功能

Error messages    //错误信息、

Externals   //    数据绑定设置

                 DataType   // 绑定数据类型

                  ExternalDataFileUrl    //数据文件地址

                  ExternalSettingsFileUrl    //设置文件地址

                   ReloadDataInterval      //刷新数据间隔

Grid        //网格线

              CategoryGridDashed     //网格竖线是否连续

             CategoryValuesColor      //x轴坐标文本的颜色

             CategoryVluesEnabled     //x轴坐标文本是否显示

              CategoryValuesFrequency    //x轴文本显示的网格线比例

               CategoryValuesInside       //x轴文本是否显示在网格内

              ValueGridAlpha         //y轴坐标

               ValuesInside       //y轴坐标显示在网格内外

Guides     //显示栏线

Image export    //图片导出

Legend    //图标

        LegendAlign     //图表对齐位置

Line    //曲线

          AreaFillAlpha   //曲线下的面积透明度

           Bullet      //曲线点的标记

          LineBalloonTextFormatString    //曲线弹出框显示的值

Margins    //边距

Plot area    //图形区

Strings    //字符串

DataSourceID     //绑定数据控件

           DataSeriesIdField    //x轴坐标数据

            Graphs //单个图表设置

Angle    3D图的角度

BackColor 控件背景色       

Labels    //图表标记

效果图片：

实现代码：

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<title>My JSP 'index.jsp' starting page</title>

<script src="amcharts/amcharts.js" type="text/javascript"></script>

<script src="amcharts/serial.js" type="text/javascript"></script>

<script type="text/javascript">

	var chart;

	var chartData = [ {

		"country" : "USA",

		"visits" : 4025

	}, {

		"country" : "China",

		"visits" : 1882

	}, {

		"country" : "Japan",

		"visits" : 1809

	}, {

		"country" : "Germany",

		"visits" : 1322

	}, {

		"country" : "UK",

		"visits" : 1122

	}, {

		"country" : "France",

		"visits" : 1114

	}, {

		"country" : "India",

		"visits" : 984

	}, {

		"country" : "Spain",

		"visits" : 711

	}, {

		"country" : "Netherlands",

		"visits" : 665

	}, {

		"country" : "Russia",

		"visits" : 580

	}, {

		"country" : "South Korea",

		"visits" : 443

	}, {

		"country" : "Canada",

		"visits" : 441

	}, {

		"country" : "Brazil",

		"visits" : 395

	}, {

		"country" : "Italy",

		"visits" : 386

	}, {

		"country" : "Australia",

		"visits" : 384

	}, {

		"country" : "Taiwan",

		"visits" : 338

	}, {

		"country" : "Poland",

		"visits" : 328

	} ];

	AmCharts.ready(function() {

		// SERIAL CHART

		chart = new AmCharts.AmSerialChart();

		chart.dataProvider = chartData;

		chart.categoryField = "country";

		//动画特效 延迟时间 秒

		chart.startDuration = 0.3;

		//3D

		chart.angle = 30;

		chart.depth3D = 15;

		// AXES

		// category

		var categoryAxis = chart.categoryAxis;

		categoryAxis.labelRotation = 90;

		categoryAxis.gridPosition = "start";

		// value

		// in case you don't want to change default settings of value axis,

		// you don't need to create it, as one value axis is created automatically.

		// GRAPH

		var graph = new AmCharts.AmGraph();

		graph.valueField = "visits";

		graph.balloonText = "[[category]]: <b>[[value]]</b>";

		//图形样式

		graph.type = "column";

		graph.lineAlpha = 0;

		graph.fillAlphas = 0.8;

		chart.addGraph(graph);

		// CURSOR

		var chartCursor = new AmCharts.ChartCursor();

		chartCursor.cursorAlpha = 0;

		chartCursor.zoomable = false;

		chartCursor.categoryBalloonEnabled = false;

		chart.addChartCursor(chartCursor);

		chart.creditsPosition = "top-right";

		chart.write("chartdiv");

	});

	function reloadData(url) {

		var dynamicData = loadStringData(url);

		chart.dataProvider = eval('(' + dynamicData + ')');

		chart.validateNow();

		chart.validateData();

	}

	//

	function loadStringData(link) {

		//return chartData2;

		if (window.XMLHttpRequest) {

			// IE7+, Firefox, Chrome, Opera, Safari

			var request = new XMLHttpRequest();

		} else {

			// code for IE6, IE5

			var request = new ActiveXObject('Microsoft.XMLHTTP');

		}

		// load

		request.open('GET', link, false);

		request.send();

		return request.responseText;

	}

	//能够获得 URL 的主机部分

	var hostName = window.location.host;

	window.setInterval("reloadData('http://" + hostName

			+ "/amcharts/charts/test')", 1000);

</script>

</head>

<body>

	<div id="chartdiv" style="width: 100%; height: 400px;"></div>

</body>

</html>

amcharts属性的更多相关文章

  1. jqu

    1 /*2 * 说明:3 * 本源代码的中文注释乃Auscarlin呕心沥血所作.旨在促进jQuery的传播以及向广大jQuery爱好者提供一个进阶4 *的途径,以让各位更加深入地了解jQuery,学 ...

  2. amcharts报表制作

    fusioncharts官网:http://www.fusioncharts.com/demos/gallery/#column-and-bar 最近使用amcharts fb4,flashBuild ...

  3. FusionCharts 分类以及各个属性参数列表

    <FusionCharts学习及使用笔记>之 第一篇 其实一直以来我都在有意无意的把我平常工作中遇到并解决的问题做个记录,放到我的网易博客中.但却一直没有想过如何把我使用的技术做一个系列化 ...

  4. SVG2PNG(前台和后台将SVG转换为PNG)--amcharts导出png

    在项目中用到了amcharts,amcharts图标统计插件是利用SVG实现的,其自带下载png功能,但是不支持IE以下浏览器.因此研究了SVG转换为png,最终实现的效果是将amcharts生成一张 ...

  5. （转贴）fusionCharts属性参考API

    一.FusionCharts的分类 关于FusionCharts的基本介绍我就不在这里浪费篇幅了,想了解的朋友自己去www.baigoogedu.com里面找吧.我就说说FusionCharts的官方 ...

  6. Amcharts 柱状图和线形图

    最近需要学习 Amcharts ,他的图表功能确实很强大.但是网上搜索到的教程很少,开始学起的确有点不方便.于是我决定把我学习的觉得好的途径,放到博客上. 下面的代码可以直接复制,但是文件要从官网上下 ...

  7. WPF中使用amCharts绘制股票K线图

    原文:WPF中使用amCharts绘制股票K线图 本想自己用GDI绘图, 通过数据直接绘制一张蜡柱图, 但觉得这样子的功能比较少, 所以到网上搜索一些能画出K线图的控件. 发现DynamicDataD ...

  8. js-静态、原型、实例属性

    本篇来说一下js中的属性: 1.静态属性 2.原型属性 3.实例属性 静态属性: function klass(){} var obj=new klass(); klass.count=0; klas ...

  9. 探究@property申明对象属性时copy与strong的区别

    一.问题来源 一直没有搞清楚NSString.NSArray.NSDictionary--属性描述关键字copy和strong的区别,看别人的项目中属性定义有的用copy,有的用strong.自己在开 ...

随机推荐

  1. Centos系统下卸载、安装MySQL及用户的创建、授权和使用（详细。。。。）

    由于经常使用linux系统,并且大数据环境搭建中经常会使用到mysql,不像windows系统下的安装,今天有点空写一篇,下面我给大家演示一遍. 主要有三部分内容: 1.MySQL的卸载 2.MySQ ...

  2. Java数据结构基础知识你知道多少？

    http://www.cnblogs.com/qlky/p/7359462.html http://www.importnew.com/28263.html HashMap( java 7) 构造函数 ...

  3. 基于Maven + SSM （Spring、SpringMVC、Mybatis）构建一个简单的测试项目

    最近在公司实习期间的培训交流中有机会接触到SSM,然后自己花费1周的时间投入学习.谈不上深刻理解其中原理,所以没有涉及理论知识,只是浅层次的学习如何使用,在此将学习过程记录整理出来,一方面自己备用:另 ...

  4. 使用IntelliJ IDEA配置Erlang开发环境

    这篇文章比较详细,感谢作者,拷贝过来做个记录 ————————————————————————————————————————————————————————————————————————————— ...

  5. 如何从本地添加项目到Github？（Windows）

    有两种方法可以上传项目到Github 一.github在线上传文件夹 在线上传也可以上传完整的文件夹结构,直接拖拽到上传文件页面的框中即可. 点击上传文件 直接拖拽即可上传文件夹及文件夹里面的文件.如 ...

  6. Android获取SD卡路径及SDCard内存的方法

    这篇文章主要介绍了Android获取SD卡路径及SDCard内存的方法,较为详细的分析了Android针对SD卡操作所涉及的类及其具体函数功能,非常具有实用价值,需要的朋友可以参考下 本文实例讲述了A ...

  7. Android 原生 MediaPlayer 和 MediaCodec 的区别和联系（二）

    目录: (3)Android 官方网站 对 MediaPlayer的介绍 正文:  Android 官方网站 对 MediaPlayer的介绍         MediaPlayer      pub ...

  8. svn取消文件夹关联的方法

    新建个记事本,贴入以下代码,保存后重命名后缀为reg,然后在目标文件夹右键就出现了删除SVN的选项了. 代码如下: Windows Registry Editor Version 5.00 [HKEY ...

  9. Django 模板语言 标签

    前言:django的模板语法基本和flask的jinja2基本一样.下面比较一下两个模板语法的区别. ------深度变量的查找(万能的句点号) 在 Django 模板中遍历复杂数据结构的关键是句点字 ...

  10. 【日常记录】用 vs2015 编译 love2d 引擎时出现 依赖项目luajit编译失败的解决办法

    如图片所示,提示是没有找到cmake命令.看来是需要camke软件支持的,由于当初安装CMake后我重装了系统,也没有把cmake的bin路径 解决办法一:重新安装CMake,并勾选上"ad ...