---
title: 地図のルック&フィールを変更する
author: Hue Team
type: post
date: 2016-07-19T00:00:17+00:00
url: /change-your-maps-look-and-feel/
sf_thumbnail_type:
- none
sf_thumbnail_link_type:
- link_to_post
sf_detail_type:
- none
sf_page_title:
- 1
sf_page_title_style:
- standard
sf_no_breadcrumbs:
- 1
sf_page_title_bg:
- none
sf_page_title_text_style:
- light
sf_background_image_size:
- cover
sf_social_sharing:
- 1
sf_sidebar_config:
- left-sidebar
sf_left_sidebar:
- Sidebar-2
sf_right_sidebar:
- Sidebar-1
sf_caption_position:
- caption-right
sf_remove_promo_bar:
- 1
sf_custom_excerpt:
- 2つの特別な変数をHueの設定に指定するだけで、Hueの地図のルック&フィールを変更することができることをご存知でしたか?
categories:
- Hue 3.11
- SDK
- SQL
---
2つの特別な変数をHueの設定に指定するだけで、Hueの地図のルック&フィールを変更することができることをご存知でしたか?
[
][1]
上記はHueの地図のデフォルトのスタイルです。私たちは描画にオープンソースのライブラリであるLeafletを使用しています。
LeafletはHueで使用することができる、地図プロバイダのリストを一緒にまとめる素晴らしい作業も行いました: https://leaflet-extras.github.io/leaflet-providers/preview/
[
][2]
Esriを表示してみましょう。Hueでの衛星画像です!
微調整する必要があるプロパティは`leaflet_tile_layer`と`leaflet_tile_layer_attribution` で、hue.iniファイルで設定できます:
[desktop]
leaflet_tile_layer=https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}
leaflet_tile_layer_attribution='Tiles © Esri — Source: Esri, i-cubed, USDA, USGS, AEX, GeoEye, Getmapping, Aerogrid, IGN, IGP, UPR-EGP, and the GIS User Community'
値はLeafletプロバイダのデモで扱っているものとまったく同じです。
Hueでの最新のセキュリティの改善により、`server.arcgisonline.com`同様にタイルドメインをホワイトリストに登録して`*.tile.osm.org`の代わりに置く必要があります。
[desktop]
secure_content_security_policy="script-src 'self' 'unsafe-inline' 'unsafe-eval' *.google-analytics.com *.doubleclick.net *.mathjax.org data:;img-src 'self' *.google-analytics.com *.doubleclick.net server.arcgisonline.com data:;style-src 'self' 'unsafe-inline';connect-src 'self';child-src 'none';object-src 'none'"
驚くべきことに、Hueを再起動すると地図を使用するすべてのアプリが衛星画像になっています!
[
][3]
いつものように、コメントとフィードバックは [hue-user][4] メーリングリストや[@gethue][5]までお気軽に!
[1]: https://cdn.gethue.com/uploads/2016/07/Screenshot-2016-07-18-21.15.19.jpg
[2]: https://cdn.gethue.com/uploads/2016/07/Screenshot-2016-07-18-21.23.35.jpg
[3]: https://cdn.gethue.com/uploads/2016/07/Screenshot-2016-07-18-21.26.53.jpg
[4]: http://groups.google.com/a/cloudera.org/group/hue-user
[5]: https://twitter.com/gethue