Инструменты Heatmap для веб-приложений
Вы можете использовать идентификатор данных в качестве состояния вместо логического значения (например, openedMenuId)
import React, { Component } from 'react'
import Menu from '@material-ui/core/Menu'
import MenuItem from '@material-ui/core/MenuItem'
const dataMap = [
{
id: 1,
name: "john"
}, {
id: 2,
name: "Doe"
}
]
export default class MyComponent extends Component {
state = {
openedMenuId: null
}
handleClick(newOpenedMenuId) {
this.setState({
openedMenuId: newOpenedMenuId
})
}
render() {
const mapResult = dataMap.map((item, index) => {
const id = item.id;
const name = item.name;
return <span key={index}>
{name}
<Menu
open={this.state.openedMenuId === item.id}
>
<MenuItem id={id}>First</MenuItem>
<MenuItem id={id}>Second</MenuItem>
<MenuItem id={id}>Third</MenuItem>
</Menu>
</span>
})
return (
<div>
{mapResult}
</div>
)
}
}
3 ответа
Карты тепла часто используются вместо более стандартного термина: средства оценки плотности ядра. Если необходимо вычислить их на лету, считайте ТРАВУ GIS - а именно, v.kernel или v.neighbors модули. Они генерируют непрерывную оценку (т.е. растровая поверхность) плотности в некотором разрешении целевого шаблона (определенный текущими настройками региона). GIS ТРАВЫ можно управлять с помощью кода Python, таким образом, это был бы простой вопрос для записи обертки Python вокруг базовых модулей, которые могли экспортировать результаты в веб-приложение.
Для небольших наборов данных проект R имеет несколько функций для чтения/записи пространственных данных и вычислительных оценок плотности ядра.
Я предположу, что это - данные с тремя значениями на точку данных - мы назовем их x, y и z. Действительно помогло бы, были ли X и Y пространственными координатами, поскольку это делает вещи легче.
Так или иначе генерируйте битовый массив x на годы (масштабируемый соответственно).
Для каждой пары X и Y в данных масштабируйте z к между 0 и 1 (или 0 и однако много цветов, которые Вы имеете в своей карте), и выведите z на печать как цвет, представленный тем значением. Например, простая карта могла просто использовать часть R RGB, в этом случае у Вас будет 256 церемоний вручения дипломов для Вашего красного.
Скорее всего, Вы хотели бы что-то более необычное, но необходимо смочь получить идею.
Если Ваши точки данных распространены независимо, можно или вывести их на печать как прямоугольники, которые занимают место или гладко интерполируют между ними.
Примечание: Существует веб-инструмент, который делает это здесь. Я нашел, что это связалось из статьи Wikipedia о heatmaps. Существует Java один слишком связан оттуда также.
я понимаю, что это старый, старый пост -- но следующий парень, который наткнется на эту страницу, может попробовать gheat для тепловых карт в веб-приложениях. Есть порты для Django и Google App Engine, если вы случайно используете эти бэкэнды.