热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

谷歌可视化-设置饼图切片颜色

如何解决《谷歌可视化-设置饼图切片颜色》经验,为你挑选了1个好方法。

我有一个用于饼图的数据表,我需要根据行中的值设置切片的颜色.例如,我有一个按类型划分的汽车销售表(例如租赁,现金,财务),我想为每一个指定颜色.在文档中,似乎可以使用条形图执行此操作,但我似乎无法使用切片执行此操作.我尝试了以下方法:

var pieChart = new google.visualization.ChartWrapper({
    options : {
        ...
        slices: [{color: 'black'}, {color: 'green'}, {color: 'red'}]
    }
});

色彩呈现得到,但我想说明blacklease.关于如何让这个工作的任何想法?



1> WhiteHat..:

slices数组中的颜色应与数据表中的行的顺序相同

所以,有以下几行......

data.addRows([
  ['Cash', 5],
  ['Finance', 20],
  ['Lease', 15]
]);

对于'Lease'黑色,它应该是数组中的最后一种颜色

slices: [{color: 'green'}, {color: 'red'}, {color: 'black'}]

如果行的顺序未知,您可以动态设置颜色

使用对象为颜色创建地图

// create color map
var colors = {
  'Cash': 'green',
  'Finance': 'red',
  'Lease': 'black'
};

然后根据数据表中的值构建切片数组

// build slices
var slices = [];
for (var i = 0; i 

请参阅以下工作代码段...

google.charts.load('current', {
  callback: drawChart,
  packages: ['corechart']
});

function drawChart() {
  var data = new google.visualization.DataTable();
  data.addColumn('string', 'sales');
  data.addColumn('number', 'count');
  data.addRows([
    ['Cash', 5],
    ['Finance', 20],
    ['Lease', 15]
  ]);
  data.sort([{column: 1, desc: true}]);

  // create color map
  var colors = {
    'Cash': 'green',
    'Finance': 'red',
    'Lease': 'black'
  };

  // build slices
  var slices = [];
  for (var i = 0; i 


推荐阅读
author-avatar
马佳叮
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有