0

我想从我的 javascript 函数中渲染/调用融合图。

例如：- 目前我们需要做这些来显示图表：-

<script type="text/javascript"><!--

      var myChart = new FusionCharts( "Column3D", "myChartId", "400", "300" );
      myChart.setXMLUrl("Data.xml");
      myChart.render("chartContainer"); 
    // --> 
    </script>

但我想编写一个函数来渲染它，如下所示： -

<script type="text/javascript"><!--

      var column3d = new MyChart.Column.YFColumn3D("MSColumn3D", "MSColumn3DChart", "1100", "300");
      column3d.setXMLUrl("Data.xml");
      column3d.render("chartContainer"); 
    // --> 
    </script>

这里 YFColumn3D 可以是渲染融合图实际功能的函数。

提前致谢。

4

1 回答 1

0

从问题下讨论的评论中，我得出您想要基于图表类型的单独功能。一种很酷的方法是创建包装函数FusionCharts来做同样的事情。

<script type="text/javascript">
// Assuming that MyCharts is the object to which you want to
// add type based abstractions.
var MyCharts = {};

(function (requiredChartTypes, objectToExtend) {
    for (var chartType in requiredChartTypes) {
        objectToExtend[chartType] = (function (chartType) {
            return function (id, width, height) { // add more args if needed
                new FusionCharts({
                    type: chartType,
                    width: width,
                    height: height
                });
            };
        }(chartType));
    }
}({
    column3d: true,
    column2d: true
    pie2d: true
}, MyCharts));
</script>

<script type="text/javascript">
// Now anywhere you can use as follows
var newChart = MyCharts.column3d("myChartId", "1100", "300");
</script>
</head>

<body>
</body>
</html>

我不确定这是否能满足您的要求，但我仍然会尝试解释我是如何使它工作的。如果您的问题有所不同，我会要求您重新措辞或详细说明。更好的问题，更好的解决方案。;-)

  1. 我首先在包含FusionCharts.js. 第一个参数是我打算在我的函数中使用的图表类型列表，第二个是我想借给映射到每个图表类型的单个函数的对象。
  2. 然后，我遍历了所需图表类型的列表，并向我的对象添加了要为该对象中的每个属性扩展的函数。这些函数只id接受width和height。
  3. 每个图表类型的函数都放在一个闭包下以保留图表类型。
  4. 每个图表的函数在调用时会返回具有特定图表类型和其他参数的 FusionCharts 新实例。
于 2013-10-23T15:36:51.663 回答