首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >有没有可能在gmaps4rails谷歌地图显示屏上用颜色来分隔一组点呢?

有没有可能在gmaps4rails谷歌地图显示屏上用颜色来分隔一组点呢?
EN

Stack Overflow用户
提问于 2013-03-24 17:05:19
回答 2查看 123关注 0票数 3

我有一个地址的地图显示,这是用于交付。每个地址都在一个特定的递送路线上,因此根据递送路线以不同的颜色显示点将非常方便。

可能会显示数百个递送地址,但通常只有几个递送路线。阅读文档,这是可能的by using different images,但由于我不能控制路线的数量,我宁愿能够动态设置现有默认图标的颜色变化。到目前为止,我的控制器中有以下内容:

代码语言:javascript
复制
@json = @company.addresses.where(:route_id => @premise.routes).to_gmaps4rails do |address, marker|
  marker.title "#{address.route.name}"
  # address route can be differentiated with address.route.id

end

目标是使具有特定路由id的所有地址具有相同的颜色。

EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2013-05-14 03:59:25

我的回答是相当冗长的,但似乎工作正常。我从我发现的一个blog post中提取了一些代码,它可以生成可能既不同又可读的颜色。

我根据路由名称的第一个字母为每个市场分配不同的字母。然后分配一种颜色,该颜色对于每条路线都是唯一和一致的。这意味着即使两个路由具有相同的首字母,它们也很有可能具有不同的颜色。

毫无疑问,有大量的重构工作要做!

代码语言:javascript
复制
def index
  @premise = @company.premises.find(params[:premise]) if params[:premise]

  #only generate the map info if a premise has been selected
  if @premise.present?
    @json = @company.addresses.approved.where(:route_id => @premise.routes).to_gmaps4rails do |address, marker|
      marker.picture({
        :picture => "http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=#{address.route.name[0]}|#{random_colour_by_index(address.route.name)}|000000"
      })
      marker.title "#{address.route.name}"
    end
  end
end

private

def random_colour_by_index(index)
  @colour ||= Hash.new
  @colour[index] ||= array_rgb_to_hex(hsv_to_rgb(rand, 0.5, 0.95))
end

def array_rgb_to_hex(rgb)
  rgb.inject("") { |hex, element| hex + single_rgb_to_hex(element) }
end

def single_rgb_to_hex(rgb)
  hex = rgb.to_s(16)
  rgb < 16 ? "0#{hex}" : hex
end

def hsv_to_rgb(h, s, v)
  h_i = (h*6).to_i
  f = h*6 - h_i
  p = v * (1 - s)
  q = v * (1 - f*s)
  t = v * (1 - (1 - f) * s)
  r, g, b = v, t, p if h_i==0
  r, g, b = q, v, p if h_i==1
  r, g, b = p, v, t if h_i==2
  r, g, b = p, q, v if h_i==3
  r, g, b = t, p, v if h_i==4
  r, g, b = v, p, q if h_i==5
  [(r*256).to_i, (g*256).to_i, (b*256).to_i]
end
票数 0
EN

Stack Overflow用户

发布于 2013-04-02 11:52:02

您可以使用RMagic http://www.imagemagick.org/RMagick/doc/为每条路线动态创建新的标记图像,并使用route.id作为索引的地图对其进行缓存。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/15596730

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档