整合營銷服務商

          電腦端+手機端+微信端=數據同步管理

          免費咨詢熱線:

          利用 Echarts 簡單制作省份或區域地圖步驟

          Echarts 無論是制作省份地圖還是區縣域地圖,他們的步驟都是基本一樣的。

          下面本人就 利用 Echarts 簡單繪制省份地圖 的步驟與經驗與各位分享一下。

          1、準備工作

          • 1.1 下載js靜態文件china.jsecharts.min.js

          • 1.2 下載中國各省、各市的 .json 文件省份或者地區的數據文件網址:https://github.com/longwosion/geojson-map-china

          2、獲取省份數據

          • 2.1 第一步:獲取XX省的地圖 json 數據文件(例:江蘇省:32.json)(是以各省身份證號 前兩位 開頭命名的)
          • 2.2 第二步:將獲取到的JSON文件 轉換 成 js 文件(江蘇省:jiangsu.js)
          • 2.3 第三步:修改轉換后的 js 文件 打開 js 文件添加變量 xx (這里本人命名習慣為 :(省名拼音小寫+Json)例:jiangsuJson)var xx = (js文件)
          • 例:
              var jiangsuJson = {"type": "FeatureCollection","cp":[118.8586,32.915], ........}保存 js 文件。

          3、在Django中編寫 HTML 代碼

          • 3.1 在<head> </head>中引入 js 文件
          <script type="text/javascript" src="/static/js/echarts.min.js"></script>
          <script type="text/javascript" src="/static/js/jiangsu.js"></script>
          • 3.2 在<body></body>中寫入作圖代碼
          <div>
              {# 標記 #}
               <a class="btn btn-success btn-sm" >江蘇省</a>
              {# 地圖代碼開始 #}
               <div class="x-body">
                   <!-- 為ECharts準備一個具備大小(寬高)的Dom -->
                   <div id="main" style="width: 949.75px;height:450px;"></div>
                   </div>
                              
                   <script type="text/javascript">
                         echarts.registerMap('jiangsu', jiangsuJson);
          
                         // 基于準備好的dom,初始化echarts實例
                         var myChart = echarts.init(document.getElementById('main'));
          
                         // 使用剛指定的配置項和數據顯示圖表。
                         myChart.setOption({
                             series: [{
                                 type: 'map',
                                 map: 'jiangsu'
                                 }]
                          });
                     </script>                    
          </div>
          • 3.3 運行代碼,就能看到結果

          4、總結

          其實只要按照本人上面的做法,就可以制作出來,本人繪不是很復雜,如果各位對省圖還需要其他顯示功能,大家不妨訪問 Echarts 的官網。

          于轉載授授權

          大數據文摘作品,歡迎個人轉發朋友圈,自媒體、媒體、機構轉載務必申請授權,后臺留言“機構名稱+文章標題+轉載”,申請過授權的不必再次申請,只要按約定轉載即可,但文末需放置大數據文摘二維碼。

          編譯:佘彥遙程序注釋:席雄芬校對:丁雪

          Folium是建立在Python生態系統的數據整理(Datawrangling)能力和Leaflet.js庫的映射能力之上的開源庫。用Python處理數據,然后用Folium將它在Leaflet地圖上進行可視化。

          概念

          Folium能夠將通過Python處理后的數據輕松地在交互式的Leaflet地圖上進行可視化展示。它不單單可以在地圖上展示數據的分布圖,還可以使用Vincent/Vega在地圖上加以標記。

          這個開源庫中有許多來自OpenStreetMap、MapQuest Open、MapQuestOpen Aerial、Mapbox和Stamen的內建地圖元件,而且支持使用Mapbox或Cloudmade的API密鑰來定制個性化的地圖元件。Folium支持GeoJSON和TopoJSON兩種文件格式的疊加,也可以將數據連接到這兩種文件格式的疊加層,最后可使用color-brewer配色方案創建分布圖。

          安裝

          安裝folium包

          開始創建地圖

          創建底圖,傳入起始坐標到Folium地圖中:

          importfolium

          map_osm= folium.Map(location=[45.5236, -122.6750]) #輸入坐標

          map_osm.create_map(path='osm.html')

          Folium默認使用OpenStreetMap元件,但是Stamen Terrain, Stamen Toner, Mapbox Bright 和MapboxControl空間元件是內置的:

          #輸入位置,tiles,縮放比例

          stamen =folium.Map(location=[45.5236, -122.6750], tiles='Stamen Toner',zoom_start=13)

          stamen.create_map(path='stamen_toner.html')#保存圖片

          Folium也支持Cloudmade 和 Mapbox的個性化定制地圖元件,只需簡單地傳入API_key :

          custom =folium.Map(location=[45.5236, -122.6750], tiles='Mapbox',

          API_key='wrobstory.map-12345678')

          最后,Folium支持傳入任何與Leaflet.js兼容的個性化地圖元件:

          tileset= r'http://{s}.tiles.yourtiles.com/{z}/{x}/{y}.png'

          map =folium.Map(location=[45.372, -121.6972], zoom_start=12,

          tiles=tileset, attr='My DataAttribution')

          地圖標記

          Folium支持多種標記類型的繪制,下面從一個簡單的Leaflet類型的位置標記彈出文本開始:

          map_1 =folium.Map(location=[45.372, -121.6972], zoom_start=12,

          tiles='Stamen Terrain')

          map_1.simple_marker([45.3288,-121.6625], popup='Mt. Hood Meadows')#文字標記

          map_1.simple_marker([45.3311,-121.7113], popup='Timberline Lodge')

          map_1.create_map(path='mthood.html')

          Folium支持多種顏色和標記圖標類型:

          map_1 =folium.Map(location=[45.372, -121.6972], zoom_start=12,tiles='Stamen Terrain')

          map_1.simple_marker([45.3288,-121.6625], popup='Mt. Hood Meadows',marker_icon='cloud') #標記圖標類型為云

          map_1.simple_marker([45.3311,-121.7113], popup='Timberline Lodge',marker_color='green') #標記顏色為綠色

          map_1.simple_marker([45.3300,-121.6823], popup='Some OtherLocation',marker_color='red',marker_icon='info-sign')

          #標記顏色為紅色,標記圖標為“info-sign”)

          map_1.create_map(path='iconTest.html')

          Folium也支持使用個性化的尺寸和顏色進行圓形標記:

          map_2 =folium.Map(location=[45.5236, -122.6750], tiles='Stamen Toner',

          zoom_start=13)

          map_2.simple_marker(location=[45.5244,-122.6699], popup='The Waterfront')

          簡單樹葉類型標記

          map_2.circle_marker(location=[45.5215,-122.6261], radius=500,

          popup='Laurelhurst Park',line_color='#3186cc',

          fill_color='#3186cc')#圓形標記

          map_2.create_map(path='portland.html')

          Folium有一個簡便的功能可以使經/緯度懸浮于地圖上:

          map_3 =folium.Map(location=[46.1991, -122.1889], tiles='Stamen Terrain',zoom_start=13)

          map_3.lat_lng_popover()

          map_3.create_map(path='sthelens.html')

          Click-for-marker功能允許標記動態放置:

          map_4 =folium.Map(location=[46.8527, -121.7649], tiles='Stamen Terrain',zoom_start=13)

          map_4.simple_marker(location=[46.8354,-121.7325], popup='Camp Muir')

          map_4.click_for_marker(popup='Waypoint')

          map_4.create_map(path='mtrainier.html')

          Folium也支持來自Leaflet-DVF的Polygon(多邊形)標記集:

          map_5 =folium.Map(location=[45.5236, -122.6750], zoom_start=13)

          map_5.polygon_marker(location=[45.5012,-122.6655], popup='Ross Island Bridge',fill_color='#132b5e', num_sides=3,radius=10)#三邊形標記

          map_5.polygon_marker(location=[45.5132,-122.6708], popup='Hawthorne Bridge',fill_color='#45647d', num_sides=4,radius=10)#四邊形標記

          map_5.polygon_marker(location=[45.5275,-122.6692], popup='Steel Bridge',fill_color='#769d96', num_sides=6, radius=10)#四邊形標記

          map_5.polygon_marker(location=[45.5318,-122.6745], popup='Broadway Bridge',fill_color='#769d96', num_sides=8,radius=10) #八邊形標記

          map_5.create_map(path='bridges.html')

          Vincent/Vega標記

          Folium能夠使用vincent 進行任何類型標記,并懸浮在地圖上。

          buoy_map= folium.Map(location=[46.3014, -123.7390], zoom_start=7,

          tiles='StamenTerrain')

          buoy_map.polygon_marker(location=[47.3489,-124.708], fill_color='#43d9de',radius=12, popup=(vis1, 'vis1.json'))

          buoy_map.polygon_marker(location=[44.639,-124.5339], fill_color='#43d9de',radius=12, popup=(vis2, 'vis2.json'))

          buoy_map.polygon_marker(location=[46.216,-124.1280], fill_color='#43d9de',radius=12, popup=(vis3, 'vis3.json'))

          GeoJSON/TopoJSON層疊加

          GeoJSON 和TopoJSON層都可以導入到地圖,不同的層可以在同一張地圖上可視化出來:

          geo_path= r'data/antarctic_ice_edge.json'

          topo_path= r'data/antarctic_ice_shelf_topo.json'

          ice_map= folium.Map(location=[-59.1759, -11.6016],tiles='Mapbox Bright', zoom_start=2)

          ice_map.geo_json(geo_path=geo_path)#導入geoJson層

          ice_map.geo_json(geo_path=topo_path,topojson='objects.antarctic_ice_shelf')#導入Toposon層

          ice_map.create_map(path='ice_map.html')

          分布圖

          Folium允許PandasDataFrames/Series類型和Geo/TopoJSON類型之間數據轉換。Color Brewer 顏色方案也是內建在這個庫,可以直接導入快速可視化不同的組合:

          importfolium

          importpandas as pd

          state_geo= r'data/us-states.json'#地理位置文件

          state_unemployment= r'data/US_Unemployment_Oct2012.csv'#美國失業率文件

          state_data= pd.read_csv(state_unemployment)

          #LetFolium determine the scale

          map =folium.Map(location=[48, -102], zoom_start=3)

          map.geo_json(geo_path=state_geo,data=state_data,

          columns=['State', 'Unemployment'],

          key_on='feature.id',

          fill_color='YlGn',fill_opacity=0.7, line_opacity=0.2,

          legend_name='Unemployment Rate(%)')

          map.create_map(path='us_states.html')

          基于D3閾值尺度,Folium在右上方創建圖例,通過分位數創建最佳猜測值,導入設定的閾值很簡單:

          map.geo_json(geo_path=state_geo,data=state_data,

          columns=['State', 'Unemployment'],

          threshold_scale=[5, 6, 7, 8, 9,10],

          key_on='feature.id',

          fill_color='BuPu',fill_opacity=0.7, line_opacity=0.5,

          legend_name='Unemployment Rate(%)',

          reset=True)

          map.create_map(path='us_states.html')

          通過Pandas DataFrame進行數據處理,可以快速可視化不同的數據集。下面的例子中,df DataFrame包含6列不同的經濟數據,我們將在下面可視化一部分數據:

          2011年就業率分布圖

          map_1 =folium.Map(location=[48, -102], zoom_start=3)

          map_1.geo_json(geo_path=county_geo,data_out='data1.json', data=df,

          columns=['GEO_ID','Employed_2011'],key_on='feature.id',

          fill_color='YlOrRd',fill_opacity=0.7, line_opacity=0.3,

          topojson='objects.us_counties_20m')#2011就業率分布圖

          map_1.create_map(path='map_1.html')

          2011年失業率分布圖

          map_2 =folium.Map(location=[40, -99], zoom_start=4)

          map_2.geo_json(geo_path=county_geo,data_out='data2.json', data=df,

          columns=['GEO_ID','Unemployment_rate_2011'],

          key_on='feature.id',

          threshold_scale=[0, 5, 7, 9, 11,13],

          fill_color='YlGnBu', line_opacity=0.3,

          legend_name='Unemployment Rate2011 (%)',

          topojson='objects.us_counties_20m')#2011失業率分布圖

          map_2.create_map(path='map_2.html')

          2011年中等家庭收入分布圖

          map_3 =folium.Map(location=[40, -99], zoom_start=4)

          map_3.geo_json(geo_path=county_geo,data_out='data3.json', data=df,

          columns=['GEO_ID','Median_Household_Income_2011'],

          key_on='feature.id',

          fill_color='PuRd',line_opacity=0.3,

          legend_name='Median Household Income2011 ($)',

          topojson='objects.us_counties_20m')#2011中等家庭收入分布圖

          map_3.create_map(path='map_3.html')


          編譯者簡介

          回復“志愿者”,了解我們及如何加入我們

          大數據文摘精彩文章:

          回復【金融】 看【金融與商業】專欄歷史期刊文章

          回復【可視化】感受技術與藝術的完美結合

          回復【安全】 關于泄密、黑客、攻防的新鮮案例

          回復【算法】 既漲知識又有趣的人和事

          回復【谷歌】 看其在大數據領域的舉措

          回復【院士】 看眾多院士如何講大數據

          回復【隱私】 看看在大數據時代還有多少隱私

          回復【醫療】 查看醫療領域文章6篇

          回復【征信】 大數據征信專題四篇

          回復【大國】 “大數據國家檔案”之美國等12國

          回復【體育】 大數據在網球、NBA等應用案例

          回復【志愿者】了解如何加入大數據文摘

          專注大數據,每日有分享

          數據分析和可視化領域,Seaborn庫憑借其優雅的設計理念和高效的繪圖能力備受青睞。今天,我們將聚焦于Seaborn的一個重要組件——distplot,它是用于描繪單變量分布的強大工具,能夠幫助我們更深入地洞察數據特征。本文將詳細介紹如何在Python Web開發環境中使用Seaborn的distplot功能,并通過實際案例展現其在揭示數據分布特性上的價值。

          Seaborn與distplot簡介

          Seaborn是一個基于matplotlib的數據可視化庫,專門針對統計圖形進行了優化,提供了高層次的接口,使復雜的數據可視化變得簡單易行。distplot則是Seaborn中的一個重要函數,它可以繪制單變量的概率密度分布圖,包括直方圖、核密度估計曲線(KDE)、正態分布擬合線以及分位數點等元素。

          distplot基本用法及參數解析

          首先,我們引入必要的庫,并通過一個簡單的隨機數據集來演示distplot的基本用法:

          import seaborn as sns
          import numpy as np
          import matplotlib.pyplot as plt
          
          # 創建一個隨機數據集
          data = np.random.normal(size=1000)
          
          # 使用distplot繪制分布圖
          sns.distplot(data, bins=30, kde=True, rug=True)
          plt.title("Distplot Example with KDE and Rug Plot")
          plt.xlabel("Value")
          plt.ylabel("Density")
          plt.show()
          
          • sns.distplot(data):這是最基礎的形式,直接傳遞待分析的數據系列。
          • bins參數指定了直方圖的柱子數量,用于控制直方圖的精細程度。
          • kde=True啟用核密度估計,即在直方圖上方繪制一條平滑曲線,反映數據的概率密度分布。
          • rug=True則會在X軸上顯示“地毯狀”標記,即每個觀測值的小短線,直觀展示數據點的位置分布。

          distplot進階應用

          除了上述基本用法外,distplot還允許我們在同一圖表中疊加多種分布情況,例如比較兩組或多組數據:

          data1 = np.random.normal(0, 1, size=500)
          data2 = np.random.normal(2, 0.5, size=500)
          
          sns.distplot(data1, hist_kws={"alpha": 0.5}, label="Data Set 1")
          sns.distplot(data2, hist_kws={"alpha": 0.5}, label="Data Set 2")
          plt.legend()
          plt.title("Comparing Two Distributions using Distplot")
          plt.show()
          
          • hist_kws參數允許我們傳遞額外的關鍵字參數給直方圖,此處設置透明度alpha,便于觀察兩個分布的疊加效果。
          • label用于指定每組數據的標簽,在繪制完成后使用plt.legend()顯示圖例。

          distplot與DataFrame的整合

          對于含有多個變量的DataFrame,distplot可以便捷地繪制多變量分布:

          df = pd.DataFrame({
              'Column_A': np.random.randn(1000),
              'Column_B': np.random.gamma(2, size=1000),
              'Column_C': np.random.exponential(1, size=1000)
          })
          
          for column in df.columns:
              sns.distplot(df[column], hist=False, kde_kws={"shade": True}, label=column)
          plt.legend(title="Columns in DataFrame")
          plt.title("Distribution of Columns in a DataFrame")
          plt.show()
          
          • 對于DataFrame中的每一列,我們禁用了直方圖并啟用了陰影KDE曲線,使得每種分布更加鮮明。

          distplot在Python Web應用中的實踐

          在Web應用程序中,distplot可以被嵌入到網頁中以動態展示數據分布。借助Flask框架和Jinja2模板,你可以創建一個REST API,從數據庫獲取數據并在前端頁面上實時繪制分布圖。這里僅給出大致流程:

          from flask import Flask, render_template, jsonify
          import seaborn as sns
          import numpy as np
          import pandas as pd
          
          app = Flask(__name__)
          
          # 假設有一個從數據庫獲取數據的方法
          def fetch_data():
              # 返回模擬的數據集
              ...
          
          @app.route('/api/data')
          def data_api():
              data = fetch_data()
              return jsonify(data.tolist())
          
          @app.route('/')
          def index():
              return render_template('index.html')
          
          if __name__ == '__main__':
              app.run(debug=True)
          
          # 在index.html文件中,通過JavaScript庫(如Bokeh或Plotly.js)接收JSON數據并使用前端可視化庫繪制distplot風格的分布圖
          

          總結

          distplot作為Seaborn的核心組件,以其強大的功能和靈活的配置,為我們深入剖析單變量數據分布提供了有力支持。在實際的Python Web開發項目中,結合后端數據處理能力和前端交互式可視化技術,distplot及其他Seaborn圖表可以有效地提升用戶體驗,使復雜的統計信息更為直觀、易于理解。


          主站蜘蛛池模板: 国产成人久久精品区一区二区| 丝袜人妻一区二区三区网站| 濑亚美莉在线视频一区| 日本一区二区三区在线视频| 人妻无码第一区二区三区| 国产91一区二区在线播放不卡| 国产精品视频一区二区三区| 精品国产免费一区二区三区香蕉 | 国产一区二区三区在线观看精品| 亚洲一区二区三区高清在线观看 | 竹菊影视欧美日韩一区二区三区四区五区| 亚洲日本中文字幕一区二区三区 | 国产一区二区三区在线| 精品无码人妻一区二区三区品| 中文字幕一区二区视频| 一区二区在线播放视频| 国产人妖在线观看一区二区| 成人H动漫精品一区二区| 学生妹亚洲一区二区| 毛片一区二区三区| 日本免费一区二区在线观看| 日韩精品一区二区三区老鸭窝| 精品无码人妻一区二区三区品| 亚洲一区综合在线播放| 3d动漫精品成人一区二区三| 91在线一区二区| 久久综合亚洲色一区二区三区| 亚洲视频一区在线| 成人中文字幕一区二区三区 | 精品一区二区三区免费毛片| 国产一区二区精品在线观看| 福利电影一区二区| 国产午夜精品一区二区三区小说| 国产综合一区二区在线观看| 午夜福利av无码一区二区| 中文字幕日韩一区| 精品国产一区二区二三区在线观看| 精品国产精品久久一区免费式| 日韩精品一区二区三区中文字幕 | 无码AV动漫精品一区二区免费| 国产av福利一区二区三巨|