Avalados por :
Uso de Gráficos de Barras y Gráficos de Donut en SAPUI5 para mostrar proporciones de datos
- Creado 01/03/2024
- Modificado 01/03/2024
- 1 Vistas
0
Cargando...
Gráficos circulares são amplamente utilizados em apresentações e escritórios, os gráficos circulares ajudam a mostrar proporções entre categorias, dividindo um círculo em segmentos proporcionais. Cada comprimento de arco representa uma proporção de cada categoria, enquanto o círculo completo representa a soma total de todos os dados, equivalente a 100%.
Um gráfico de rosca é essencialmente um gráfico circular com uma área no centro cortada.
Data.Json:
JSON é um formato muito leve para armazenar dados e pode ser diretamente utilizado como fonte de dados para aplicações SAPUI5. Agora crie um arquivo JSON dentro da pasta do modelo da aplicação.
Especifique os dados no arquivo JSON conforme abaixo:
Para acessar o arquivo JSON acima em toda a aplicação, especifique o URI do arquivo JSON no modelo sob a seção sap.ui5 no arquivo manifest.json. Especificamos o tipo como JSON e o URI que é o caminho para os dados JSON para instanciar o Modelo JSON conforme mostrado abaixo.
View:
Em nosso exemplo, eu escolhi Department como a Dimensão,
Contagem de funcionários como medidas.
Um gráfico de rosca é essencialmente um gráfico circular com uma área no centro cortada.
Data.Json:
JSON é um formato muito leve para armazenar dados e pode ser diretamente utilizado como fonte de dados para aplicações SAPUI5. Agora crie um arquivo JSON dentro da pasta do modelo da aplicação.
Especifique os dados no arquivo JSON conforme abaixo:
{
"items": [{
"Department": "R & D",
"EmployeeCount": "20"
}, {
"Department": "Syngenta",
"EmployeeCount": "30"
}, {
"Department": "Volvo",
"EmployeeCount": "35"
}, {
"Department": "NIKE",
"EmployeeCount": "60"
}, {
"Department": "ADIDAS",
"EmployeeCount": "70"
}]
}
Para acessar o arquivo JSON acima em toda a aplicação, especifique o URI do arquivo JSON no modelo sob a seção sap.ui5 no arquivo manifest.json. Especificamos o tipo como JSON e o URI que é o caminho para os dados JSON para instanciar o Modelo JSON conforme mostrado abaixo.
"sap.ui5": {
.
"models": {
"i18n": {
"type": "sap.ui.model.resource.ResourceModel",
"settings": {
"bundleName": "Donut_Chart.i18n.i18n"
}
},
"Data": {
"Data": {
"type": "sap.ui.model.json.JSONModel",
"uri": "model/Data.json"
}
}
},
"resources": {
"css": [{
"uri": "css/style.css"
}]
}
}
View:
Na visualização, defina um gráfico Vizframe do tipo donut usando os namespaces abaixo
xmlns:viz="sap.viz.ui5.controls"
xmlns:vizFeeds="sap.viz.ui5.controls.common.feeds"
xmlns:vizData="sap.viz.ui5.data".
Em nosso exemplo, eu escolhi Department como a Dimensão,
Contagem de funcionários como medidas.
<viz:VizFrame xmlns="sap.viz" id="idDonutChart" vizType="donut" width="100%" height="100%"
vizProperties="{plotArea: { drawingEffect: 'glossy' },title:{ text:'Exemplo de Gráfico de Rosca'}}">
<viz:dataset>
<vizData:FlattenedDataset data=
Pedro Pascal
Se unió el 07/03/2018
Facebook
Twitter
Pinterest
Telegram
Linkedin
Whatsapp
Sin respuestas
No hay respuestas para mostrar
Se el primero en responder
contacto@primeinstitute.com
(+51) 1641 9379
(+57) 1489 6964
© 2024 Copyright. Todos los derechos reservados.
Desarrollado por Prime Institute
Hola ¿Puedo ayudarte?