this._dataTable = $("#listtable").DataTable({
    paging: true,
    responsive: true,
    deferRender: true,
    columns: [{
        title: "Name",
        data: "thing.name"
    }, {
        title: "State 1",
        data: "state1",
        type: "state1",
        render: (data, type, row, meta) => {
            return this._renderState1(data, meta);
        }
    }, {
        title: "State 2",
        data: "state2",
        type: "state2",
        render: (data, type, row, meta) => {
            return this._renderState2(data, meta);
        }
    }]
});

var cell = this._dataTable
    .cell({ row: meta.row, column: meta.col })
    .node();

var cellClass = this._getStateClass(state);
$(cell).addClass(cellClass);

.cell-state1 {
    padding: 0;
}

this._dataTable = $("#listtable").DataTable({
    paging: true,
    responsive: true,
    deferRender: true,
    columns: [{
        title: "Name",
        data: "thing.name"
    }, {
        title: "State1",
        data: "state1",
        type: "state1",
        className: "cell-state1",
        render: (data, type, row, meta) => {
            return this._renderState1(data, meta);
        }
    }]
});

.cell-state1-somestate {
  height: 100%;
  width: 100%;
  padding: 8px;
  background-color: #000000;
  color: #ffffff;
}

function _renderState1 (state1) {
    var cssClass = _this._getState1CellClass(state1);
    var text = _this._getState1CellText(state1);
    var content = "<div class='" + cssClass + "'>" + text + "</div>";
    return content;
};

var dtResizeTimer;
var allowPropagation = false;
$(window).on("resize.DT-visitsTable", function (event) {
    if (allowPropagation === false) {
        event.stopImmediatePropagation();
        clearTimeout(dtResizeTimer);
        dtResizeTimer = setTimeout(function() {
            allowPropagation = true;
            $(window).trigger("resize.DT-visitsTable");
        }, 100);
    } else {
        allowPropagation = false;
    }
});