How to use the custom ol/source/TileImage?

[vvizden]

Hi,

The TileSuperMapRest extends ol/source/TileImage in the code snippet below. How can i code when using vuelayers?

Thank you!

var layer = new ol.layer.Tile({
    source: new TileSuperMapRest({
        url: url,
        wrapX: true
    }),
    projection: 'EPSG:3857'
});

[ghettovoice]

Hello @vvizden , you can wrap TileSuperMapRest into Vue component (similar to VueLayers sources) or just add source in runtime.

1. Wrap into the component it depends on which VueLayers version do you using:
   • v0.11.x - you can mixin https://github.com/ghettovoice/vuelayers/blob/v0.11.x/src/mixin/tile-source.js. Import import { tileSource } from 'vuelayers/lib/mixin'
   • v0.12.x - you can mixin https://github.com/ghettovoice/vuelayers/blob/master/src/mixins/tile-image-source.js. Import import { tileImageSource } from 'vuelayers/dist/mixins'

Those mixins provides basic methods, props, watchers.

2. Append your custom source in runtime

<vl-layer-tile ref="layer" @created="layerCreated" />

<script>
export default {
  methods: {
    layerCreated (vm) {
      vm.$layer.setSource(new TileSuperMapRest({
        url: url,
        wrapX: true
      }))
    },
  },
}
</script>