为地图各区域添加颜色.docx

1、为地图各区域添加颜色为地图各区域添加颜色为地图各区域添加颜色摘 要：这一节主要介绍了为地图根据不同区域添加颜色的方法，并给出相关代码。关键词： JSON；等值区域；加载数据1等值区域等值区域指的是不同区域填充了不同值（深或浅）或颜色，以反映关联数据值的地图。在 ，人们常说的“红州，蓝州”等值区域地图，展示的是各个州对共和 和民主 的倾向，特别是在选举的时候很常见。但等值区域地图可以基于任何值而不光是 派倾向来生成。这些地图也是使用D3 生成最多的地图类型。尽管等值区域地图非常有实用价值，但也不要忘了它存在一些固有的感知局限性。因为这种图使用面积来编码值，人口密度低而面积大的州（比如内华达）从视

2、觉上会显得比实际人数多。标准的等值区域图不能恰当地体现人均指标，内华达州太大了，而特拉华州又太小了。可是，这种图却能很好地标识地理区域，特别是在地图中，看起来真的非常好看。2创建比例尺首先，创建一个比例尺，将数据值作为输入，返回不同的颜色。这是等值区域地图的核心所在：var color = d3.scale.quantize().range(rgb(237,248,233), rgb(186,228,179),rgb(116,196,118), rgb(49,163,84),rgb(0,109,44);以量化的比例尺函数作为线性比例尺，但比例尺输出的则是离散的范围。这里输出的值可以是数值、颜色

3、（这里就是），或者其他你需要的值。这个比例尺适合把值分类为不同的组（bucket）。我们这里只分了5 个组，实际上你想分几个就分几个。3加载数据注意，这里只指定了输出范围，而没有指定输入值域。接下来，要加载一些数据。我们有一个文件叫us-ag-productivity-2004.csv，内容类似如下所示：state,valueAlabama,1.1791Arkansas,1.3705Arizona,1.3847California,1.7979Colorado,1.0325Connecticut,1.3209Delaware,1.4345.这些数据来自 农业部，报告内容是2004 年每个州的农

4、业生产力指标。这些值的单位是以1996 年阿拉巴马州的生产力指标为基准（1.0），更大的值表示生产力更高，更小的值表示生产力更低。接下来我们就利用这些数据生成一个漂亮的 各州生产力地图。要加载这些数据，使用d3.csv()：d3.csv(us-ag-productivity-2004.csv, function(data) .然后，在回调函数中，要设置彩色的量化比例尺的输入值域：color.domain(d3.min(data, function(d) return d.value; ),d3.max(data, function(d) return d.value; );这里用到了d3.mi

5、n() 和d3.max() 来计算并返回最小和最大的数据值，因此这个比例尺的输出值域是动态计算的。4加载JSON 地理数据接下来，跟前面一样，加载JSON 地理数据。但不同的是，在这里我想把农业生产力的数据合并到GeoJSON 中。为什么？因为我们一次只能给元素绑定一组数据。GeoJSON 数据肯定必不可少，因为要据以生成路径，而我们还需要新的农业生产力数据。为此，就要把它们混合成一个巨大的数组，然后再把混合后的数据绑定到新创建的path 元素。d3.json(us-states.json, function(json) / 混合农业生产力数据和GeoJSON/ 循环农业生产力数据集中每个值f

6、or (var i = 0; i data.length; i+) / 取得州名var dataState = datai.state;/ 取得数据值，并从字符串转换成浮点数var dataValue = parseFloat(datai.value);/ 在GeoJSON 中找到相应的州for (var j = 0; j 1 And x 50 Thenb = 3 大于50变红色(3是红色的代码)Elseb = 10 小于50为绿色(10是绿色的代码)End IfActiveChart.SeriesCollection(1).Points(i - 1).Interior.ColorIndex

7、= b 设置图表的各个柱子的颜色NextEnd Sub从代码中可以看到,这是使用了sheet2工作表的Change事件来实现的,只要工作表中B2:B4区域中的数据被修改了,图表就会自动根据库存数改变颜色.上面的例子中,每次改变数据区域的值,都会删除旧的图表,再生成一个新的图表,有的朋友不喜欢这样,希望只生成一次图表,以后数据改变时,只针对该图表改变颜色,这样图表中的其他设置不受影响.用下面代码可以实现执行下面代码前,必须先手工生成一张B2:B4区域的图表,且该图表在sheet2表中的图表ID为1(最好除这一张图表外,没有其他图表).Private Sub Worksheet_Change(By

8、Val Target As Range)x = Target.Rowy = Target.Column数值改变的区域为B列的B2:B4时,生成新的图表If y = 2 And x 1 And x 50 Thenb = 3 大于50变红色(3是红色的代码)Elseb = 10 小于50为绿色(10是绿色的代码)End IfActiveChart.SeriesCollection(1).Points(i - 1).Interior.ColorIndex = b 设置图表的各个柱子的颜色NextEnd Sub下面是改变颜色后的图表注意B2单元格与B4单元格中的数值是大于50的,所以图表自动改变了对应的柱子颜色为红色.1 下面我将通过报警器功能来实现Age这一列数值颜色的变化。2 点击报警器选项并新建报警器3 选择过滤的对象，运算符，操作数。在我的例子里面我将用红色显示Age小于50的值。用绿色显示介于50-60的值，用蓝色显示大于60的值。点击添加子报警器来增加报警条件，点击格式可以改变数值显示的颜色和背景色。4 创建完毕以后点击确定回到报表页面，点击需要添加报警的数据列（Age）。5 点击报警器选项，勾选所创建的报警器应用到Age数据列6. 点击确定，Age列的数据值将按照我设定的条件按不同颜色显示