API Docs for: 0.2
Show:

JC.FChart Class

JC.FChart - flash 图表组件

require: JC.BaseMVC , SWFObject , JSON2 , jQuery.mousewheel

JC Project Site | API docs | demo link

页面只要引用本脚本, 默认会处理 div class="js_compFChart"

可用的 HTML attribute

chartScriptData = script tpl selector
图表的脚本模板数据
chartDataVar = json object name
图表的json数据名, window变量域
chartWidth = number, default = 100%
图表的宽度
chartHeight = number, default = 400
图表的高度
chartScroll = bool, default = true
图表是否响应鼠标滚动

Constructor

JC.FChart

(
  • _selector
)

Parameters:

Example:

   <div class="js_compFChart"
       chartScriptData="|script"
       chartWidth="600"
       chartHeight="400"
       >
       <script type="text/template">
           {
               chart: {
                   type: 'bar' 
               }, 
               title: {
                   text:'Chart Title'
               },
               subtitle: {
                   text: 'sub title'
               }, 
               xAxis: {
                   categories: [ '1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12' ]
               }, 
               yAxis: {
                   title: {
                       text: '(Vertical Title - 中文)'
                   }
               },
               series:[{
                   name: 'Temperature'
                   , data: [-50, 0, 3, -20, -20, 27, 28, 32, 30, 25, 15, -58]
                   , style: { 'stroke': '#ff7100' } 
                   , pointStyle: {}
               }, {
                   name: 'Rainfall',
                   data: [20, 21, 20, 100, 200, 210, 220, 100, 20, 10, 20, 10]
               }],
               credits: {
                   enabled: true
                   , text: 'fchart.openjavascript.org'
                   , href: 'http://fchart.openjavascript.org/'
               },
               displayAllLabel: true,
               legend: {
                   enabled: false
               }
           }
       </script>
   </div>

Methods

_beforeInit

() private

初始化之前调用的方法

_init

(
  • _selector
)
private

内部初始化方法

Parameters:

  • _selector Selector

_inited

() private

内部初始化完毕时, 调用的方法

_initHanlderEvent

() private

内部事件初始化方法

init

(
  • _selector
)
Array of FChartInstance static

初始化可识别的 FChart 实例

Parameters:

  • _selector Selector

Returns:

Array of FChartInstance:

notification

(
  • _evtName
  • _args
)

通知选择器有新事件
JC 组件以后不会在 HTML 属性里放回调, 改为触发 selector 的事件

Parameters:

notificationHandler

(
  • _evtName
  • _args
)

通知选择器有新事件, 有返回结果
JC 组件以后不会在 HTML 属性里放回调, 改为触发 selector 的事件

Parameters:

Returns:

:

on

(
  • _evtName
  • _cb
)

使用 jquery on 绑定事件

Parameters:

Returns:

BaseMVCInstance

selector

()

获取 显示 BaseMVC 的触发源选择器, 比如 a 标签

Returns:

selector

trigger

(
  • _evtName
  • _args
)

使用 jquery trigger 触发绑定事件

Parameters:

Returns:

BaseMVCInstance

triggerHandler

(
  • _evtName
  • _args
)

使用 jquery triggerHandler 触发绑定事件

Parameters:

Returns:

:

update

(
  • object
)

更新数据

Parameters:

Properties

Model.FLASH_PATH

String static

flash swf 路径
{0} = JC.PATH
{1} = chart file name

Default: {0}/flash/pub/charts/{1}.swf

Model.SWF_FILE_MAP

Object static

flash swf 路径映射
你还可以使用其他属性进行定义路径映射

 1. window.FCHART_SWF_FILE_MAP
 2. JC.FCHART_SWF_FILE_MAP

Default: null

Example:

   requirejs( [ 'JC.FChart' ], function( FChart ){
       FChart['Model'].SWF_FILE_MAP = {
           'bar': 'http://fchart.openjavascript.org/modules/JC.FChart/0.1/swf/Histogram.swf'
           , 'vbar': 'http://fchart.openjavascript.org/modules/JC.FChart/0.1/swf/VHistogram.swf'
           , 'line': 'http://fchart.openjavascript.org/modules/JC.FChart/0.1/swf/CurveGram.swf'
           , 'stack': 'http://fchart.openjavascript.org/modules/JC.FChart/0.1/swf/Stack.swf'
           , 'mix': 'http://fchart.openjavascript.org/modules/JC.FChart/0.1/swf/MixChart.swf'
           , 'column': 'http://fchart.openjavascript.org/modules/JC.FChart/0.1/swf/ZHistogram.swf'
           , 'hcolumn': 'http://fchart.openjavascript.org/modules/JC.FChart/0.1/swf/VZHistogram.swf'
       };
   });

Model.TYPE_MAP

Object static

图表类型映射
曲线图: line, curvegram
柱状图: bar, histogram
垂直柱状图: var, vhistogram
饼状图: pie, piegraph
圆环图: dount
评分球: rate

Model.VERSION

String static

flash swf 缓存版本控制

Default: requirejs.s.contexts._.config.urlArgs || 'v=' + JC.pathPostfix || 'v=fchart'