const longitudeLatitudeProjectedScratch = new Cartesian3();

function computeIJ(imageryProvider, x, y, level, longitude, latitude, format) {
  if (ijScratchComputed) {
    return;
  }

  computeLongitudeLatitudeProjected(
    imageryProvider,
    x,
    y,
    level,
    longitude,
    latitude
  );
  const projected = longitudeLatitudeProjectedScratch;

  const rectangle = imageryProvider.tilingScheme.tileXYToNativeRectangle(
    x,
    y,
    level,
    rectangleScratch
  );
  ijScratch.x =
    ((imageryProvider.tileWidth * (projected.x - rectangle.west)) /
      rectangle.width) |
    0;
  ijScratch.y =
    ((imageryProvider.tileHeight * (rectangle.north - projected.y)) /
      rectangle.height) |
    0;
  ijScratchComputed = true;
}

var canvas = document.createElement("canvas")
canvas.width = that._tileWidth
canvas.height = that._tileHeight
var vectorContext = canvas.getContext("2d")
var features = that._mvtParser.readFeatures(arrayBuffer)
var styleFun = that._styleClass.getStyle()
var extent = [0, 0, 4096, 4096]
for (var i = 0; i < features.length; i++) {
var feature = features[i]
var styles = styleFun(features[i], that._resolutions[level])
for (var j = 0; j < styles.length; j++) {
    const render = toContext(vectorContext);
    render.drawFeature(feature,styles[j]);
}
}

if (that._tileQueue.count > that._cacheSize) {
    trimTiles(that._tileQueue, that._cacheSize / 2)
}
canvas.xMvt = x
canvas.yMvt = y
canvas.zMvt = level+2
that._tileQueue.markTileRendered(canvas)
return canvas

var features = that._mvtParser.readFeatures(arrayBuffer,{
  dataProjection: new Projection({
    code: 'TILE_PIXELS',
    units: 'tile-pixels',
    extent: [0, 0, 4096, 4096]
  }),
  featureProjection:new Projection({
    code: 'TILE_PIXELS',
    units: 'tile-pixels',
    extent: [0, 0, 256, 256]
  })
})

import MVT from 'ol/format/MVT.js';
import CanvasBuilderGroup from 'ol/render/canvas/BuilderGroup.js';
import CanvasExecutorGroup from 'ol/render/canvas/ExecutorGroup.js';
import {renderFeature} from 'ol/renderer/vector.js';

MvtImageryProvider.prototype.requestImage = function (x, y, level, request) {
  // .... 省略很多代码

  const builderGroup = new CanvasBuilderGroup(0,extent,resolution,this._pixelRatio);

  for (var i = 0; i < features.length; i++) {
    var feature = features[i]
    var styles = styleFun(features[i], that._resolutions[level])
    for (var j = 0; j < styles.length; j++) {
        // ol.renderer.vector.renderFeature_(_replayGroup, feature, styles[j], 16)
        renderFeature(builderGroup,feature,styles[j],16)
    }
  }
  // _replayGroup.finish()
  const executorGroupInstructions=builderGroup.finish();
  const renderingReplayGroup = new CanvasExecutorGroup(extent,resolution,this._pixelRatio,null,executorGroupInstructions);

  //this._pixelRatio = 1
  // this._transform = [0.125, 0, 0, 0.125, 0, 0]，这是512x512点瓦片，
  renderingReplayGroup.execute(vectorContext,that._pixelRatio, that._transform,0,true);

  // .... 省略很多代码
}

MVTImageryProvider.prototype.requestImage = function (x, y, level, request) {

  var url = this._url
  // 这里不知道为什么，如果直接写level的话，那么我的4326的坐标系，就无法获取正确的图层
  level=level+2
  var reverseY = this._tilingScheme.getNumberOfYTilesAtLevel(level)-y-1;
  // 拼接url
  url = url.replace("{x}", x).replace("{y}", y).replace("{reverseY}", reverseY).replace("{z}", level).replace("{k}", this._key)
  var resource = Cesium.Resource.createIfNeeded(url)

  // ... 省略部分代码

  var canvas = document.createElement("canvas")
  // 这里的width为什么是 4096，暂时没有理论支撑，不太清楚。
  canvas.width = 4096
  canvas.height = 4096
  var ctx = canvas.getContext("2d")

  // 绘制方里网格
  ctx.moveTo( 0, 0 );  //起点
  ctx.lineTo( 0, that._tileWidth);
  ctx.lineTo( that._tileWidth, that._tileHeight );
  ctx.lineTo( that._tileHeight, 0 );  
  // 颜色设置，必须放在绘制之前
  ctx.strokeStyle = 'red';
  // 线宽设置，必须放在绘制之前
  ctx.lineWidth = 1;
  ctx.stroke();  //描边(绘制)
  // 绘制文本
  ctx.font = "30px serif";
  //2. 使用`fillStyle`设置字体颜色。
  ctx.fillStyle = "#00AAAA";
  //3. 使用`fillText()`方法显示字体。
  let text="z:"+level+",x:"+x+",y:"+y
  ctx.fillText(text,0,50);

  return canvas;
}

const provider = new MvtImageryProvider({
    url: "https://map.hongjing.fpi-inc.site:8081/maps/tdt_jj/{z}/{x}/{y}.mvt",
    styleConfig: sourceConfig["osm_jj"].styleConfig,
    minimumLevel: 4,
    maximumLevel: 20
})
let cesium = mars3d.Cesium
console.log(cesium)
const viewer = this.map.viewer
//通过imageryLayers获取图层列表集合
const imageryLayers = viewer.scene.imageryLayers;
imageryLayers.addImageryProvider(provider);