Git Product home page Git Product logo

dart-vector-tile-renderer's People

Contributors

blaugold avatar greensopinion avatar ianthetechie avatar josxha avatar lukas-heiligenbrunner avatar micheljung avatar mvarendorff avatar timenglart avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

dart-vector-tile-renderer's Issues

Support interpolate, step and case expressions for color and number values

Values like these:

'fill-opacity': [
  'interpolate',
  ['linear'],
  ['zoom'],
  0,
  1,
  15.5,
  1,
  16,
  0,
  22,
  0
],

currently just return null because they are nether a map nor a number:

DoubleZoomFunction _toDouble(doubleSpec) {
if (doubleSpec is num) {
final value = doubleSpec.toDouble();
return (zoom) => value;
}
if (doubleSpec is Map) {
final model = DoubleFunctionModelFactory().create(doubleSpec);
if (model != null) {
return (zoom) => DoubleThemeFunction().exponential(model, zoom);
}
}
return (_) => null;
}

Color values are handled in the same way.

I am willing to work on this (and already started fiddling around a bit), if you don't mind!

Disclaimer: I am doing this for one of our client projects and will likely only cover the things we "need" (like linear interpolation, while not implementing exponential) but also try my best to create groundwork that makes adding more functionality easier.

wrong implementation of text halo color

https://docs.mapbox.com/mapbox-gl-js/style-spec/layers/#paint-symbol-text-halo-color

The color of the text's halo, which helps it stand out from backgrounds.

But in code it's mapped to shadow property of TextStyle, while it should be backgroundColor

Below is screenshot from Maptiler server serving toner-v2 style: You can the color is mapped to background color of Text not creating shadow.
Screenshot 2023-04-15 at 12 24 38 PM

Below is screenshot from dart-vector-tile-renderer plugin, generated using flutter-vector-map-tiles:

Screenshot 2023-04-15 at 12 28 01 PM

Note: There are other issues too in parsing map theme, in this issue I am highlighting only text-halo-color

Pass custom map data

I was unable to figure out how to provide custom map data. Could you please explain or create some documentation for anyone who is trying to do things that are not in the example?

Rendering on web looks broken

This is the example app, viewed in chrome:

Screenshot 2022-01-02 at 12 06 28

And here viewed in safari:

Screenshot 2022-01-02 at 12 10 31

Maybe this is related to differences in handling of floating-point numbers between the Dart VM and JS engines.

Support expressions for line-dasharray

Currently the paint_factory only allows fixed arrays of numbers for line-dasharray and not expressions like ["get", "stroke-dasharray"]:

final dashJson = paint['$prefix-dasharray'];
if (dashJson != null && dashJson is List<num> && dashJson.length >= 2) {
if (dashJson.any((element) => element < .0)) {
logger.warn(() => '$prefix-dasharray contains value < 0');
} else {
dashArray = dashJson.map((e) => e.toDouble()).toList(growable: false);
}
}

ImageRenderer and scale between 1 and 4

Hi guys,
First of all thank you for developing this very interesting library.
I'm using this library directly in flutter_map for better performance and custom tile loading, instead of the "classical" vector_map_tiles.
I was wondering why you put in the code of ImageRenderer the assert fo the scale parameter, enforcing it between 1 and 4.
Currently, I have forked your project and removed this restriction, using a scale parameter up to 16.
I'm using the flutter_map as a full screen widget and, for my data source, I'm limited to use a maxNativeZoom to 14. With this limitation, I wasn't able to obtain nice and high resolution tiles of the map on zoom between 16 and 19, also working with the zoomScaleFactor and zoom parameters in the render method, and the scale parameter maximum value was too limiting.

Have you any other solution to improve this setup?

Thank you!

How to pass tiles map in Tileset class with mutiple tile layers. What should be the tiles key in that situation.

class Tileset {
  final bool preprocessed;
  final Map<String, Tile> tiles;
  late final LayerFeatureResolver _resolver;

  Tileset(this.tiles) : preprocessed = false {
    _resolver = DefaultLayerFeatureResolver(this);
  }
}

This is multiple data layer in bytes array

var tileData1 = TileFactory(theme, const Logger.noop())
                  .createTileData(VectorTileReader().read(tileBytes1));

var tileData2 = TileFactory(theme, const Logger.noop())
                  .createTileData(VectorTileReader().read(tileBytes2));

final tile1 = tileData1.toTile();
final tile2 = tileData2.toTile();

 Map<String, Tile> tiles = {};
 tiles.putIfAbsent("openmaptiles", () => tile1);
 tiles.putIfAbsent("?", () => tile2);   // what should be the value of key in this situation

final tileset = TilesetPreprocessor(theme)
                  .preprocess(Tileset(tiles), zoom: tileZXYValue[0].toDouble());

Rendering issues

Hi, first of all, really cool project! Just tried out the flutter_map example with Mapbox and the Streets style.

I've seen some rendering issues:

  • Zooming in/out causes the app to freeze/lag intermittently on my Macbook Air M1, raster thread is sometimes way above 3x frame budget, in the hundreds of milliseconds per frame even in smaller cities. As a stress test, try zooming in on Tokyo which has a lot of vectors densely packed. This is generally not an issue in other vector-based map renderers on my machine.
    • Could canvas.save() be somewhat expensive? I know saveLayer is, but not sure about save, as opposed to manipulating the coordinates rather than the canvas.
  • Road signs are rendered without the signs themselves (only white text which is hard to read without any background), I'm guessing this is because of lacking support for raster layer types?
  • Some labels are not rendered, for example the Baltimore label is never rendered, regardless of zoom level.
  • If you strive for very similar looks, then I think highways and such (orange/yellow roads) have a thin white pixel border, similar to how text is rendered on the map.

Using Mapbox renderer:
Screenshot 2022-11-11 at 13 57 39

Using vector-tile-renderer:
Screenshot 2022-11-11 at 13 58 58

hybrid maps?

Are hybrid maps supported? I'm trying to switch between a few styles, including mapbox/satellite-streets-v12; that one has both a raster layer and a vector layer, from the stylesheet:

"sources": {
  "mapbox-satellite": {
    "url": "mapbox://mapbox.satellite",
    "type": "raster",
    "tileSize": 256
  },
  "composite": {
    "url": "mapbox://mapbox.mapbox-streets-v8",
    "type": "vector"
  }
},

If not directly supported, any suggestions about how to implement this? We're switching between vector tilesets and this, so I think I could add a separate layer to the map when this style is active, but I thought there might be a more consolidated solution.

Edit: is this more of a question for the vector_map_tiles project?

Edit 2: Is showing a raster base layer a possibility? In the changelog, v. 1.1.25 says:

support multiple tile sources so that data such as hillshade can be rendered on a map

... can we do transparent backgrounds with this package? From that changelog comment, and a couple issues, I wasn't so sure.

[Bug] Delay in showing text when map is rotating.

There is a significant delay of showing text when map is rotated or Zoomed In/out or moved.

Seems like a Bug, but from code based it seems like a workaround was done to remove jitter.

Do we have plan on fixing it ?

TileProviders with Json sources instead of directly to pbf/image files

What should be done with a Map Style like this, which link to sources that are Json files too, which show the correct way to access the data (pbf/image) files (example)?

I tried using the urlTemplates given in the secondary Json sources (such as in the above example: https://israelhiking.osm.org.il/vector/data/IHM/{z}/{x}/{y}.pbf) instead of the Json files, but I get an InvalidProtocolBufferException: Protocol message tag had invalid wire type..

Any ideas? Am I doing something wrong? (Thanks a lot for this great plugin, by the way)

Getting type 'List<Object>' is not a subtype of type 'String?' error on text anchors

I'm using a custom MapBox style and some text-anchor fields in the theme data are lists instead of strings:

"text-anchor": [
  "step",
  ["zoom"],
  [
    "step",
    ["get", "sizerank"],
    "center",
    5,
    "top"
  ],
  17,
  [
    "step",
    ["get", "sizerank"],
    "center",
    13,
    "top"
  ]
],

This causes an error when typecasting text-anchor on line 134 inside theme_reader.dart

 final anchor = LayoutAnchor.fromName(layout?['text-anchor'] as String?);

Are there plans to support these text-anchor values?
Thanks in advance

InExpression and NotInExpression are out of (recommended) spec

The Mapbox Expression docs about in state the following in regards to the syntax:

["in",
    keyword: InputType (boolean, string, or number),
    input: InputType (array or string)
]: boolean

This library however parses in expressions vastly differently by interpreting the first argument as property-key to ["get"] from the feature and all remaining values (opposed to a single allowed value according to the mapbox spec) as haystack to search in for the received property-value:

class InExpressionParser extends ExpressionComponentParser {
InExpressionParser(ExpressionParser parser) : super(parser, 'in');
@override
bool matches(List<dynamic> json) {
return super.matches(json) && json.length >= 3 && json[1] is String;
}
@override
Expression? parse(List<dynamic> json) {
final getExpression = parser.parseOptional(['get', json[1]]);
if (getExpression != null) {
final values = json.sublist(2);
return InExpression(getExpression, values);
}
return null;
}
}

This parsing of the in (as well as support for the !in expression) appears to support a now deprecated version of MapLibre styles.

I am open to creating a PR for this but I guess it should first be clear how this change would be handled (since it very much is breaking) across this package as well als vector_map_tiles.

Failed assertion: line 155 pos 12: 'a != 0': is not true.

Rendering of one specific tile failed:

======== Exception caught by rendering library =====================================================
The following assertion was thrown during paint():
'package:vector_tile_renderer/src/model/geometry_decoding.dart': Failed assertion: line 155 pos 12: 'a != 0': is not true.

The relevant error-causing widget was: 
  VectorTileLayerWidget VectorTileLayerWidget:file:///home/zegkljan/git/oko-app/lib/main_widget.dart:506:12
When the exception was thrown, this was the stack: 
#2      decodePolygons (package:vector_tile_renderer/src/model/geometry_decoding.dart:155:12)
#3      _SyncIterator.moveNext (dart:core-patch/core_patch.dart:180:26)
#4      new _GrowableList._ofOther (dart:core-patch/growable_array.dart:219:26)
#5      new _List._ofOther (dart:core-patch/array.dart:116:43)
#6      new _List.of (dart:core-patch/array.dart:58:18)
#7      new List.of (dart:core-patch/array_patch.dart:53:20)
#8      Iterable.toList (dart:core/iterable.dart:470:12)
#9      TileFeature.paths (package:vector_tile_renderer/src/model/tile_model.dart:59:45)
#10     PolygonRenderer.render (package:vector_tile_renderer/src/features/polygon_renderer.dart:34:30)
#11     FeatureDispatcher.render (package:vector_tile_renderer/src/features/feature_renderer.dart:45:16)
#12     DefaultLayer.render.<anonymous closure> (package:vector_tile_renderer/src/themes/theme_layers.dart:53:33)
#13     TileSpaceMapper.drawInTileSpace (package:vector_tile_renderer/src/features/tile_space_mapper.dart:37:7)
#14     DefaultLayer.render (package:vector_tile_renderer/src/themes/theme_layers.dart:51:29)
#15     Renderer.render.<anonymous closure>.<anonymous closure> (package:vector_tile_renderer/src/renderer.dart:47:20)
#16     List.forEach (dart:core-patch/array.dart:224:8)
#17     Renderer.render.<anonymous closure> (package:vector_tile_renderer/src/renderer.dart:45:29)
#18     Timeline.timeSync (dart:developer/timeline.dart:163:22)
#19     profileSync (package:vector_tile_renderer/src/profiling.dart:16:19)
#20     Renderer.render (package:vector_tile_renderer/src/renderer.dart:34:5)
#21     _VectorTilePainter.paint (package:vector_map_tiles/src/grid/grid_vector_tile.dart:232:38)
#22     RenderCustomPaint._paintWithPainter (package:flutter/src/rendering/custom_paint.dart:563:13)
#23     RenderCustomPaint.paint (package:flutter/src/rendering/custom_paint.dart:605:7)
#24     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2449:7)
#25     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13)
#26     RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15)
#27     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2449:7)
#28     PaintingContext._repaintCompositedChild (package:flutter/src/rendering/object.dart:141:11)
#29     PaintingContext.repaintCompositedChild (package:flutter/src/rendering/object.dart:100:5)
#30     PaintingContext._compositeChild (package:flutter/src/rendering/object.dart:198:7)
#31     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:185:7)
#32     RenderBoxContainerDefaultsMixin.defaultPaint (package:flutter/src/rendering/box.dart:2847:15)
#33     RenderStack.paintStack (package:flutter/src/rendering/stack.dart:629:5)
#34     PaintingContext.pushLayer (package:flutter/src/rendering/object.dart:387:12)
#35     PaintingContext.pushClipRect (package:flutter/src/rendering/object.dart:443:7)
#36     RenderStack.paint (package:flutter/src/rendering/stack.dart:635:38)
#37     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2449:7)
#38     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13)
#39     RenderBoxContainerDefaultsMixin.defaultPaint (package:flutter/src/rendering/box.dart:2847:15)
#40     RenderStack.paintStack (package:flutter/src/rendering/stack.dart:629:5)
#41     RenderStack.paint (package:flutter/src/rendering/stack.dart:645:7)
#42     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2449:7)
#43     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13)
#44     RenderBoxContainerDefaultsMixin.defaultPaint (package:flutter/src/rendering/box.dart:2847:15)
#45     RenderStack.paintStack (package:flutter/src/rendering/stack.dart:629:5)
#46     RenderStack.paint (package:flutter/src/rendering/stack.dart:645:7)
#47     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2449:7)
#48     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13)
#49     RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15)
#50     RenderTransform.paint (package:flutter/src/rendering/proxy_box.dart:2397:17)
#51     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2449:7)
#52     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13)
#53     RenderShiftedBox.paint (package:flutter/src/rendering/shifted_box.dart:79:15)
#54     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2449:7)
#55     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13)
#56     RenderBoxContainerDefaultsMixin.defaultPaint (package:flutter/src/rendering/box.dart:2847:15)
#57     RenderStack.paintStack (package:flutter/src/rendering/stack.dart:629:5)
#58     RenderStack.paint (package:flutter/src/rendering/stack.dart:645:7)
#59     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2449:7)
#60     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13)
#61     RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15)
#62     PaintingContext.pushLayer (package:flutter/src/rendering/object.dart:387:12)
#63     PaintingContext.pushClipRect (package:flutter/src/rendering/object.dart:443:7)
#64     RenderClipRect.paint (package:flutter/src/rendering/proxy_box.dart:1459:23)
#65     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2449:7)
#66     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13)
#67     RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15)
#68     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2449:7)
#69     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13)
#70     RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15)
#71     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2449:7)
#72     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13)
#73     RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15)
#74     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2449:7)
#75     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13)
#76     RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15)
#77     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2449:7)
#78     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13)
#79     RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15)
#80     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2449:7)
#81     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13)
#82     _RenderLayoutBuilder.paint (package:flutter/src/widgets/layout_builder.dart:343:15)
#83     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2449:7)
#84     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13)
#85     RenderBoxContainerDefaultsMixin.defaultPaint (package:flutter/src/rendering/box.dart:2847:15)
#86     RenderStack.paintStack (package:flutter/src/rendering/stack.dart:629:5)
#87     RenderStack.paint (package:flutter/src/rendering/stack.dart:645:7)
#88     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2449:7)
#89     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13)
#90     RenderBoxContainerDefaultsMixin.defaultPaint (package:flutter/src/rendering/box.dart:2847:15)
#91     RenderCustomMultiChildLayoutBox.paint (package:flutter/src/rendering/custom_layout.dart:408:5)
#92     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2449:7)
#93     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13)
#94     RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15)
#95     _RenderInkFeatures.paint (package:flutter/src/material/material.dart:555:11)
#96     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2449:7)
#97     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13)
#98     RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15)
#99     PaintingContext.pushLayer (package:flutter/src/rendering/object.dart:387:12)
#100    RenderPhysicalModel.paint (package:flutter/src/rendering/proxy_box.dart:1929:15)
#101    RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2449:7)
#102    PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13)
#103    RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15)
#104    RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2449:7)
#105    PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13)
#106    RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15)
#107    RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2449:7)
#108    PaintingContext._repaintCompositedChild (package:flutter/src/rendering/object.dart:141:11)
#109    PaintingContext.repaintCompositedChild (package:flutter/src/rendering/object.dart:100:5)
#110    PipelineOwner.flushPaint (package:flutter/src/rendering/object.dart:995:29)
#111    RendererBinding.drawFrame (package:flutter/src/rendering/binding.dart:499:19)
#112    WidgetsBinding.drawFrame (package:flutter/src/widgets/binding.dart:883:13)
#113    RendererBinding._handlePersistentFrameCallback (package:flutter/src/rendering/binding.dart:363:5)
#114    SchedulerBinding._invokeFrameCallback (package:flutter/src/scheduler/binding.dart:1144:15)
#115    SchedulerBinding.handleDrawFrame (package:flutter/src/scheduler/binding.dart:1081:9)
#116    SchedulerBinding._handleDrawFrame (package:flutter/src/scheduler/binding.dart:995:5)
#120    _invoke (dart:ui/hooks.dart:151:10)
#121    PlatformDispatcher._drawFrame (dart:ui/platform_dispatcher.dart:308:5)
#122    _drawFrame (dart:ui/hooks.dart:115:31)
(elided 5 frames from class _AssertionError and dart:async)
The following RenderObject was being processed when the exception was fired: RenderCustomPaint#f6b89
...  parentData: <none> (can use size)
...  constraints: BoxConstraints(w=1024.5, h=1024.5)
...  size: Size(1024.5, 1024.5)
...  painter: _VectorTilePainter#7aff8(Instance of 'VectorTileModel')
RenderObject: RenderCustomPaint#f6b89
  parentData: <none> (can use size)
  constraints: BoxConstraints(w=1024.5, h=1024.5)
  size: Size(1024.5, 1024.5)
  painter: _VectorTilePainter#7aff8(Instance of 'VectorTileModel')
====================================================================================================

The pbf tile in question is (zipped in z/x/y.pbf directory structure) tile.zip. The Z/X/Y coords are 14/8847/5549 (GPS 50.099914 N, 14.403638 E), comes from openmaptiles.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.