EXTJS中提供的简单的chart工具,但是并未提供该swf文件的源码。需要从YUI上查找charts.swf文件的源码。
值得一说的是找到的源码版本不正确的话,只是一件吃力不讨好的事。
大家可以在extjs的源码charts.js文件中找到 如下内容:
Ext.chart.Chart.CHART_URL = 'http:/' + '/yui.yahooapis.com/2.8.0/build/charts/assets/charts.swf';
来确定需要查找的YUI源码版本.
附件中包含2.6版 和2.8版 charts.swf的源码
同是有一个修改示例:
在柱状图上添加数值提示。
需要注意的问题有:
1、柱状图的显示。加个数值的显示,需要将柱状图加高
2、flash每次读取数据后,会自动刷新图像,需要清除数值提示
[color=red]com.yahoo.astra.fl.charts.series.ColumnSeries.as 122行左右[/color]
var cartesianChart:CartesianChart = this.chart as CartesianChart;
var yAxis:String = this.axis == "primary" ? "verticalAxis" : "secondaryVerticalAxis";
var valueAxis:IOriginAxis = cartesianChart[yAxis] as IOriginAxis;
var otherAxis:IAxis = cartesianChart.horizontalAxis;
var verticalAxisTitle:IAxis=cartesianChart.verticalAxis;//获取X轴的相关信息
if(!valueAxis)
{
throw new Error("To use a ColumnSeries object, the vertical axis of the chart it appears within must be an IOriginAxis.");
return;
}
var allSeriesOfType:Array = ChartUtil.findSeriesOfType(this, cartesianChart);
var markerSizes:Array = [];
var totalMarkerSize:Number = this.calculateTotalMarkerSize(otherAxis, markerSizes);
var seriesIndex:int = allSeriesOfType.indexOf(this);
var markerSize:Number = markerSizes[seriesIndex] as Number;
var xOffset:Number = this.calculateXOffset(valueAxis, otherAxis, markerSizes, totalMarkerSize, allSeriesOfType);
var seriesItemSpacing:Number = UIComponentUtil.getStyleValue(UIComponent(this.chart), "seriesItemSpacing") as Number;
var startValues:Array = [];
var endValues:Array = [];
var itemCount:int = this.length;
for(var i:int = 0; i < itemCount; i++)
{
var originValue:Object = this.calculateOriginValue(i, valueAxis, allSeriesOfType);
var originPosition:Number = valueAxis.valueToLocal(originValue);
var position:Point = IChart(this.chart).itemToPosition(this, i);
var value:Object = 0;
try{
value = IChart(this.chart).itemToAxisValue(this, i, verticalAxisTitle, false);//根据X轴来获取当前柱子的值当前柱子的值
}catch (e) { value = 0; }
position.x += (allSeriesOfType.length - 1) * seriesItemSpacing;
var marker:DisplayObject = this.markers[i] as DisplayObject;
marker.x = position.x + xOffset;
marker.width = markerSize;
//删除柱状图上的 数值提示0为柱状图 1为数值
try{
var p1 = UIComponent(marker).getChildAt(1);
var p2 = UIComponent(marker).getChildAt(2);
if(p1!=null){UIComponent(marker).removeChild(p1);}
if(p2!=null){UIComponent(marker).removeChild(p2);}
}catch (e) {}
try{
if (value > 0) {
var caption:TextField=new TextField ();//创建一个TextField,也可以用Label等代替
caption.y = -15;//这里的x,y是相对于柱子来说的,所以要显示在上面,必须为负值 要显示在上面,必须为负值
if (value >= 10) {
caption.x = 1;
caption.width = 45;
}else {
caption.x = 4;
caption.width = 45;//12
}
caption.height = 30;
caption.text=String(value);//显示值
UIComponent(marker).addChild(caption);//增加这个对象
}
}catch(e){}
//if we have a bad position, don't display the marker
if(isNaN(position.x) || isNaN(position.y))
{
this.invalidateMarker(ISeriesItemRenderer(marker));
}
else if(this.isMarkerInvalid(ISeriesItemRenderer(marker)))
{
//initialize the marker to the origin
marker.y = originPosition;
marker.height = 0;
if(marker is UIComponent)
{
(marker as UIComponent).drawNow();
}
this.validateMarker(ISeriesItemRenderer(marker));
}
//stupid Flash UIComponent rounding!
position.y = Math.round(position.y);
originPosition = Math.round(originPosition*1.3);
var calculatedHeight:Number = originPosition - position.y;
if(calculatedHeight < 0)
{
calculatedHeight = Math.abs(calculatedHeight);
position.y = Math.round(originPosition);
//always put the marker on the origin
marker.y = position.y;
}
startValues.push(marker.y, marker.height*1.3);
endValues.push(position.y, calculatedHeight);
值得一说的是找到的源码版本不正确的话,只是一件吃力不讨好的事。
大家可以在extjs的源码charts.js文件中找到 如下内容:
Ext.chart.Chart.CHART_URL = 'http:/' + '/yui.yahooapis.com/2.8.0/build/charts/assets/charts.swf';
来确定需要查找的YUI源码版本.
附件中包含2.6版 和2.8版 charts.swf的源码
同是有一个修改示例:
在柱状图上添加数值提示。
需要注意的问题有:
1、柱状图的显示。加个数值的显示,需要将柱状图加高
2、flash每次读取数据后,会自动刷新图像,需要清除数值提示
[color=red]com.yahoo.astra.fl.charts.series.ColumnSeries.as 122行左右[/color]
var cartesianChart:CartesianChart = this.chart as CartesianChart;
var yAxis:String = this.axis == "primary" ? "verticalAxis" : "secondaryVerticalAxis";
var valueAxis:IOriginAxis = cartesianChart[yAxis] as IOriginAxis;
var otherAxis:IAxis = cartesianChart.horizontalAxis;
var verticalAxisTitle:IAxis=cartesianChart.verticalAxis;//获取X轴的相关信息
if(!valueAxis)
{
throw new Error("To use a ColumnSeries object, the vertical axis of the chart it appears within must be an IOriginAxis.");
return;
}
var allSeriesOfType:Array = ChartUtil.findSeriesOfType(this, cartesianChart);
var markerSizes:Array = [];
var totalMarkerSize:Number = this.calculateTotalMarkerSize(otherAxis, markerSizes);
var seriesIndex:int = allSeriesOfType.indexOf(this);
var markerSize:Number = markerSizes[seriesIndex] as Number;
var xOffset:Number = this.calculateXOffset(valueAxis, otherAxis, markerSizes, totalMarkerSize, allSeriesOfType);
var seriesItemSpacing:Number = UIComponentUtil.getStyleValue(UIComponent(this.chart), "seriesItemSpacing") as Number;
var startValues:Array = [];
var endValues:Array = [];
var itemCount:int = this.length;
for(var i:int = 0; i < itemCount; i++)
{
var originValue:Object = this.calculateOriginValue(i, valueAxis, allSeriesOfType);
var originPosition:Number = valueAxis.valueToLocal(originValue);
var position:Point = IChart(this.chart).itemToPosition(this, i);
var value:Object = 0;
try{
value = IChart(this.chart).itemToAxisValue(this, i, verticalAxisTitle, false);//根据X轴来获取当前柱子的值当前柱子的值
}catch (e) { value = 0; }
position.x += (allSeriesOfType.length - 1) * seriesItemSpacing;
var marker:DisplayObject = this.markers[i] as DisplayObject;
marker.x = position.x + xOffset;
marker.width = markerSize;
//删除柱状图上的 数值提示0为柱状图 1为数值
try{
var p1 = UIComponent(marker).getChildAt(1);
var p2 = UIComponent(marker).getChildAt(2);
if(p1!=null){UIComponent(marker).removeChild(p1);}
if(p2!=null){UIComponent(marker).removeChild(p2);}
}catch (e) {}
try{
if (value > 0) {
var caption:TextField=new TextField ();//创建一个TextField,也可以用Label等代替
caption.y = -15;//这里的x,y是相对于柱子来说的,所以要显示在上面,必须为负值 要显示在上面,必须为负值
if (value >= 10) {
caption.x = 1;
caption.width = 45;
}else {
caption.x = 4;
caption.width = 45;//12
}
caption.height = 30;
caption.text=String(value);//显示值
UIComponent(marker).addChild(caption);//增加这个对象
}
}catch(e){}
//if we have a bad position, don't display the marker
if(isNaN(position.x) || isNaN(position.y))
{
this.invalidateMarker(ISeriesItemRenderer(marker));
}
else if(this.isMarkerInvalid(ISeriesItemRenderer(marker)))
{
//initialize the marker to the origin
marker.y = originPosition;
marker.height = 0;
if(marker is UIComponent)
{
(marker as UIComponent).drawNow();
}
this.validateMarker(ISeriesItemRenderer(marker));
}
//stupid Flash UIComponent rounding!
position.y = Math.round(position.y);
originPosition = Math.round(originPosition*1.3);
var calculatedHeight:Number = originPosition - position.y;
if(calculatedHeight < 0)
{
calculatedHeight = Math.abs(calculatedHeight);
position.y = Math.round(originPosition);
//always put the marker on the origin
marker.y = position.y;
}
startValues.push(marker.y, marker.height*1.3);
endValues.push(position.y, calculatedHeight);