| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172 |
- <!--********************************************************************
- * Copyright© 2000 - 2021 SuperMap Software Co.Ltd. All rights reserved.
- *********************************************************************-->
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="UTF-8" />
- <title data-i18n="resources.title_attributes_Vue"></title>
- <script type="text/javascript" include="vue" src="../js/include-web.js"></script>
- <script include="iclient-mapboxgl-vue,mapbox-gl-enhance" src="../../dist/mapboxgl/include-mapboxgl.js"></script>
- <style>
- #main {
- margin: 0 auto;
- width: 100%;
- height: 100%;
- }
- </style>
- </head>
- <body style="margin: 0; overflow: hidden; background: #fff; width: 100%; height: 100%; position: absolute; top: 0">
- <div id="main">
- <sm-web-map style="height: 500px" server-url="https://www.supermapol.com/" map-id="505367620"></sm-web-map>
- <div style="position: relative; height: 400px; width: 100%">
- <sm-attributes layer-name="全国671个气象站观测数据" :field-configs="fieldConfigs"></sm-attributes>
- </div>
- </div>
- <script>
- new Vue({
- el: '#main',
- data() {
- return {
- fieldConfigs: [
- { value: '平均最低气温_Num', visible: false },
- { value: 'SmID', visible: false },
- {
- value: '站台',
- visible: true,
- filters: [
- { text: '塔城', value: '塔城' },
- { text: '大同', value: '大同' },
- { text: '石家庄', value: '石家庄' }
- ],
- onFilter: (value, record) => record['站台'].indexOf(value) === 0
- },
- {
- value: '省份',
- visible: true,
- onFilter: (value, record) => record['省份'].indexOf(value) === 0,
- scopedSlots: {
- filterDropdown: 'filterDropdown',
- filterIcon: 'filterIcon',
- customRender: 'customRender'
- }
- },
- { value: '海拔', visible: false },
- { value: '最高气温_Num', visible: false },
- { value: '最高气温', visible: false },
- { value: '最高七天气温_Num', visible: false },
- { value: '最热七天气温', visible: true, defaultSortOrder: 'descend' },
- { value: '最低气温_Num', visible: false },
- { value: '最低气温', visible: false },
- { value: '年均降雨_Num', visible: false },
- { value: 'lon', visible: true, title: '经度', width: 250 },
- { value: 'lat', visible: true, title: '纬度', width: 250 }
- ]
- };
- }
- });
- </script>
- </body>
- </html>
|
