MVTタイルレイヤーのフィーチャにフィーチャをスタイル設定するにはどうすればよいですか?OpenLayers MVTレイヤーとスタイルの設定
geoJSONレイヤー(geoJSONに変更するのと同じようなもの)を試してみましたが、geoJSONレイヤーが89MBでMVTが3MBなので、MVT相当のものはいいとは言えません。
は、ここに私がやったことだ:
var stySimple = new ol.style.Style({
\t \t \t \t fill: new ol.style.Fill({
\t \t \t \t \t color: 'transparent' //#ADD8E6'
\t \t \t \t }),
\t \t \t \t stroke: new ol.style.Stroke({
\t \t \t \t \t color: '#880000',
\t \t \t \t \t width: 1
\t \t \t \t })
\t \t \t });
\t \t \t
\t \t \t var styleClick = new ol.style.Style({
\t \t \t \t fill: new ol.style.Fill({
\t \t \t \t \t color: '#ADD8E6'
\t \t \t \t }),
\t \t \t \t stroke: new ol.style.Stroke({
\t \t \t \t \t color: '#008800',
\t \t \t \t \t width: 2
\t \t \t \t })
\t \t \t });
var layer = 'aw:gis_hucs';
\t \t \t var huclayer = new ol.layer.VectorTile({
\t \t \t \t style: stySimple,
\t \t \t \t source: new ol.source.VectorTile({
\t \t \t \t \t tilePixelRatio: 1, // oversampling when > 1
\t \t \t \t \t tileGrid: ol.tilegrid.createXYZ({
\t \t \t \t \t \t maxZoom: 19
\t \t \t \t \t }),
\t \t \t \t \t format: new ol.format.MVT({featureClass: ol.Feature}),
\t \t \t \t \t url: 'http://geo.host.org:8080/geoserver/gwc/service/tms/1.0.0/' + layer + '@EPSG%3A' + projection_epsg_no + '@pbf/{z}/{x}/{-y}.pbf'
\t \t \t \t })
\t \t \t });
var map = new ol.Map({
\t \t \t \t target: 'map',
\t \t \t \t layers: [
\t \t \t \t \t \t huclayer
\t \t \t \t ],
\t \t \t \t view: new ol.View({
\t \t \t \t \t center: ol.proj.fromLonLat([-84.32470703125, 33.8799896240234]),
\t \t \t \t \t zoom: 7
\t \t \t \t })
\t \t \t });
hoverInteraction = new ol.interaction.Select({
\t \t \t \t condition: ol.events.condition.pointerMove,
\t \t \t \t layers: [huclayer],
\t \t \t \t style: styleClick /****** NO BUENO 1 */
\t \t \t });
\t \t \t \t
\t \t \t \t map.on('click', function(e) {
\t \t \t \t \t \t var features = [];
\t \t \t \t \t \t
\t \t \t \t \t \t map.forEachFeatureAtPixel(e.pixel, function(feature, layer) {
\t \t \t \t \t \t \t features.push(feature);
\t \t \t \t \t \t });
\t \t \t \t \t \t \t
\t \t \t \t \t features.forEach(function(cv)
\t \t \t \t \t \t {
\t \t \t \t \t \t cv.setStyle(styleClick); /****** NO BUENO 2 */
\t \t \t \t \t \t }
\t \t \t \t \t);
\t \t \t \t });
\t \t \t \t \t
\t \t \t \t
\t \t \t map.addInteraction(hoverInteraction);
\t \t \t hoverInteraction.on('select', function(e) {
\t \t \t \t
\t \t \t \t \t
\t \t \t \t \t
\t \t \t \t if (e.deselected) e.deselected.forEach(function(cv) {
\t \t \t \t \t \t cv.setStyle(null);
\t \t \t \t \t });
\t \t \t \t if (e.selected) e.selected.forEach(function(cv) {
\t \t \t \t \t \t cv.setStyle(styleClick); /****** NO BUENO 3 */
\t \t \t \t \t });
\t \t \t \t console.log(e);
\t \t \t });
私はかなり、落胆うつ病とイライラしています。 MVTレイヤー上のフィーチャーのスタイルをどのように設定する必要がありますか?
OLは4.1.12 Geoserverである私はと対話しようとしています層の良好な表現が、機能ごとの特徴に全くダイナミックなスタイリングを取得2.11
です。私は、そうでないことを示唆している投稿にもかかわらず、私はそれを動的に行うことはできません。また、MVTレイヤー上にあるフィーチャーにスタイルを設定することはできないが、それを参照するドキュメンテーションはありません。私は何のエラーもありません。上のコードを簡単に見えるように簡略化しましたが、jsfiddleには生きていないMVTレイヤーが必要です。
選択インタラクションは、アクティブな機能と非アクティブな機能の一覧を表示します。選択されたものが表示されない場合はどういうことですか?