是否可以使用highchart-ng进行自定义渲染？

我试图使用Highcharts Renderer来创建我自己的自定义形状。不幸的是，我找不到一个方法来调用那些methods。是否可以使用highchart-ng进行自定义渲染？

它甚至可以使用Highcharts methods？与highcharts-ng？！

我的代码：这里

var myapp = angular.module('myapp', ["highcharts-ng"]); 

myapp.controller('myctrl', function ($scope) { 
    $scope.chartDonut = { 
    options: { 
     chart: { 
      type: 'pie', 

     }, 
     colors: [ 
      '#FFFFFF', 
      '#AA4643', 

     ], 
     credits: { 
     enabled: false 
     }, 

     legend: { 
     borderWidth: 0 
     }, 

     plotOptions: { 
     pie: { 
      borderWidth: 0.2, 
      borderColor: '#000000', 
     } 
     } 
    }, 

    title: { 
     text: 'Browser market share, April, 2011' 
    }, 

    backgroundColor: '#cccccc', 
    tooltip: { 
     formatter: function() { 
      return '<b>'+ this.point.name +'</b>: '+ this.y +' %'; 
     } 
    }, 
    series: [{ 
     name: 'Browsers', 
     data: [{ 
       name: 'MATCHED', 
       y: 25 
      }, { 
       name: 'UNMATCHED', 
       y: 50, 

      color: { 
       pattern: 'http://highcharts.com/demo/gfx/pattern1.png', 
       width: 6, 
       height: 6 
      } 

      }], 

     size: '60%', 
     innerSize: '56%', 
     showInLegend: false, 
     dataLabels: { 
      enabled: true, 
      connectorWidth: 0, 
      connectorPadding: 0, 
      useHTML: true, 
      x: 20, 
      formatter: function() { 
       if (this.point.name === 'UNMATCHED') 
       return '<div id="donut_unmatched">' 
         + '<div id="unmatched_num">' + this.y + '</div>' 
         + '<div id="unmatched_txt">' + this.point.name + '</div>' 
         + '</div>'; 
      } 
     } 
    }] 
    }; 
});

来源

2014-03-19 Canttouchit

我建议与此包装程序的作者联系，因为似乎并非所有Highcahrts函数都可用。 –

作者。目前无法做到这一点。拉请求欣然接受。我可能会在不久的将来自己添加它。

看到这里来追踪变化：https://github.com/pablojim/highcharts-ng/issues/97

来源

2014-03-21 13:04:35 Pablojim

这可以用当前版本来完成，而文档不清晰。在源代码中，highcharts调用构造函数：

new Highcharts.Chart(mergedOptions, func)

第二个参数是当highcharts初始化完成后的回调： http://api.highcharts.com/highcharts#Highcharts.Chart（它没有解释它的参数）我们可以从第1个获得图表对象这个函数的参数。下面的代码添加到您的图表配置对象：

func: function(chart) { 
    $scope.chartObj = chart; 
}

然后你可以使用它在您的视图或代码（任何API调用）：

<span>{{chartObj.renderer.height}}</span>

$scope.chartObj.renderer.circle(...); 
$scope.chartObj.getSelectedPoints();

正如我分叉的例子原来plunk在这里：
http://plnkr.co/edit/6WvHEjJfr4pGqd2OvPKF?p=preview

来源

2015-01-07 18:17:03 lei

我也找不到答案，但我有一个解决方案ution，它调用xAxis标签格式化函数格式化程序中的渲染器，并且它可以工作。

来源

2017-03-09 07:46:34 James

是否可以使用highchart-ng进行自定义渲染？

回答

相关问题