如何更改 google 图表中的图例形状?
how to change legend shape in google charts?
我是 angularjs 和 google 图表的新手,我想让饼图的图例形状默认为正方形 circle.here 是我的代码:
这是我在 Index.HTML:
中的代码
<head>
<script src="http://code.angularjs.org/1.2.10/angular.js"></script>
<script src="script.js"></script>
<script src="http://bouil.github.io/angular-google-chart/ng-google-chart.js"></script>
</head>
<body ng-controller="MainCtrl">
<div style="padding-left:100px">
my pig pie chart</div>
<div google-chart chart="chart" style="width:400,height:300"></div>
</body>
Script.js:
var app = angular.module('myApp', [ 'googlechart' ]);
app.controller('MainCtrl', function($scope) {
var chart1 = {};
chart1.type = "PieChart";
chart1.data = [
['Component', 'cost'],
['Software hardware and electrice', 50000],
['Hardware', 80000]
];
chart1.data.push(['Services',20000]);
chart1.options = {
'legend':'right',
'width':400,
'height':300
};
chart1.formatters = {
number : [{
columnNum: 1,
pattern: "$ #,##0.00"
}]
};
$scope.chart = chart1;
$scope.aa=1*$scope.chart.data[1][1];
$scope.bb=1*$scope.chart.data[2][1];
$scope.cc=1*$scope.chart.data[3][1];
});
任何建议指导我如何做 this.thanks
没有记录在案的选项。饼图呈现为 SVG,小圆圈是一个 <circle>
标记,因此您不能使用 CSS.
可能可以通过 JQuery 中的 DOM 操作或类似的东西来做到这一点,但由于 google 图表 API 不会呈现图表元素类 或任何东西上的 ID,无论您想出什么,都将非常脆弱,并且很容易因更改图表 API 或您的图表本身而损坏。
我认为这属于 "Things that would be nice but are not worth the effort."
的范畴
我是 angularjs 和 google 图表的新手,我想让饼图的图例形状默认为正方形 circle.here 是我的代码: 这是我在 Index.HTML:
中的代码 <head>
<script src="http://code.angularjs.org/1.2.10/angular.js"></script>
<script src="script.js"></script>
<script src="http://bouil.github.io/angular-google-chart/ng-google-chart.js"></script>
</head>
<body ng-controller="MainCtrl">
<div style="padding-left:100px">
my pig pie chart</div>
<div google-chart chart="chart" style="width:400,height:300"></div>
</body>
Script.js:
var app = angular.module('myApp', [ 'googlechart' ]);
app.controller('MainCtrl', function($scope) {
var chart1 = {};
chart1.type = "PieChart";
chart1.data = [
['Component', 'cost'],
['Software hardware and electrice', 50000],
['Hardware', 80000]
];
chart1.data.push(['Services',20000]);
chart1.options = {
'legend':'right',
'width':400,
'height':300
};
chart1.formatters = {
number : [{
columnNum: 1,
pattern: "$ #,##0.00"
}]
};
$scope.chart = chart1;
$scope.aa=1*$scope.chart.data[1][1];
$scope.bb=1*$scope.chart.data[2][1];
$scope.cc=1*$scope.chart.data[3][1];
});
任何建议指导我如何做 this.thanks
没有记录在案的选项。饼图呈现为 SVG,小圆圈是一个 <circle>
标记,因此您不能使用 CSS.
可能可以通过 JQuery 中的 DOM 操作或类似的东西来做到这一点,但由于 google 图表 API 不会呈现图表元素类 或任何东西上的 ID,无论您想出什么,都将非常脆弱,并且很容易因更改图表 API 或您的图表本身而损坏。
我认为这属于 "Things that would be nice but are not worth the effort."
的范畴