Is there a custom balloon setting in yandex map without jquery?

Question

JavaScript

Guys, hello everyone. I started setting up a custom balloon in Yandex maps and ran into a problem: they use jquery in the https://tech.yandex.ru/maps/jsbox/2.1/balloon_autopan example.

Is there an example somewhere with this piece of code, but in pure js?

build: function() {
  this.constructor.superclass.build.call(this);

  this._$element = $('.balloon', this.getParentElement());

  this.applyElementOffset();

  this._$element.find('.map-tooltip__close')
    .on('click', $.proxy(this.onCloseClick, this));
},
clear: function() {
  this._$element.find('.map-tooltip__close')
    .off('click');

  this.constructor.superclass.clear.call(this);
},
onSublayoutSizeChange: function() {
  MyBalloonLayout.superclass.onSublayoutSizeChange.apply(this, arguments);

  if (!this._isElement(this._$element)) {
    return;
  }

  this.applyElementOffset();

  this.events.fire('shapechange');
},
applyElementOffset: function() {
  this._$element.css({
    left: -(this._$element[0].offsetWidth / 2),
    top: -(this._$element[0].offsetHeight + this._$element.find('.map-tooltip')[0].offsetHeight)
  });
},
onCloseClick: function(e) {
  e.preventDefault();

  this.events.fire('userclose');
},
  getShape: function() {
    if (!this._isElement(this._$element)) {
      return MyBalloonLayout.superclass.getShape.call(this);
    }

    var position = this._$element.position();

    return new ymaps.shape.Rectangle(new ymaps.geometry.pixel.Rectangle([
      [position.left, position.top],
      [
        position.left + this._$element[0].offsetWidth,
        position.top + this._$element[0].offsetHeight + this._$element.find('.map-tooltip')[0].offsetHeight
      ]
    ]));
  },
_isElement: function(element) {
  return element && element[0] && element.find('.map-tooltip')[0];
}

Answer 1

Is there an example somewhere with this piece of code, but in pure js?

now exists

Answer 2

It is possible that it does not exist, you will have to rewrite a bit yourself