JSFiddle - React, Tailwind, and code Playground

by Shuaib Khan

HTML

<form>

</form>

CSS

.rectangle {
    position: relative;
}

.background {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.content {
    height: 800px;
    width: 200px;
		box-sizing:border-box;
}

/* .rectangle:hover .background {
    width: calc(100% + 40px);
    height: calc(100% + 40px);
    top: -20px;
    left: -20px;
    right: -20px;
    bottom: -20px;
    transition: 5s linear all;
}
.rectangle:hover .content {
    border: 20px solid red;
    transition: 5s linear all;
} */
.rectangle:hover .background {
    transition: 5s transform;
    transform: scale(1.1);
}

JavaScript

var data = [
   {
    lat: 40.621996,
    lon: -74.028679,
    places: 1,
    time: "2019/11/20 22:26:00"
   },
   {
    lat: 40.621996,
    lon: -74.028679,
    places: 1,
    time: "2019/11/20 22:26:00"},
   {
    lat: 40.621996,
    lon: -74.028679,
    places: 1,
    time: "2019/11/20 22:26:00"}
   ]
	 
	 
	 function deteleKey(obj, key){
	 	delete obj[key]
	 }
var newData = data.map((d)=>{
	['places', 'time'].forEach(e => delete d[e]);
	return d;
});
console.log(newData);