Integrar contenido

Al editar la página en modo experto, puede integrar otro contenido directamente en la página.

Incrustar una visualización de Opendatasoft

Cuando explore una visualización en un portal Opendatasoft (incluido el suyo propio), podrá ver en la parte inferior algunas opciones para compartir el contenido, como "Incrustar", que le suministrará un código HTML para pegar en la página. Con esta operación, incrustará la visualización en la página.

Incrustar una línea de tiempo de Twitter

Si tiene una cuenta en Twitter desde su página de la cuenta Twitter, puede crear "widgets" de Twitter, diseñados para integrarse en otros sitios web (como un blog). Al crear un widget, Twitter le suministra un "código" para pegar en el código HTML. Por motivos de seguridad, JavaScript está bloqueado en el editor de páginas de Opendatasoft, por lo que no podrá emplear directamente el código facilitado por Twitter. Sin embargo, en su lugar le ofrecemos un widget de Opendatasoft con este fin.

En primer lugar, tiene que capturar el "ID de widget", que aparece en la primera línea del código, en el atributo data-widget-id:

<a class="twitter-timeline" data-dnt="true" href="**https://twitter.com/hashtag/opendata**" data-widget-id="12341234123412341234">My tweets</a>

En este ejemplo, el ID de widget es "12341234123412341234".

A continuación, añada este widget en la página, utilizando el ID de widget del atributo widget-id:

<ods-twitter-timeline widget-id=""12341234123412341234></ods-twitter-timeline>

Incrustar otro contenido de terceros

Servicios como YouTube a menudo proporcionan métodos para incrustar su contenido en otros sitios web en forma de código listo para pegar. Por motivos de seguridad, no permitimos a los usuarios escribir código JavaScript en las páginas, y puede que algunos de estos códigos incrustados estén en JavaScript, de modo que no funcionarán en nuestras páginas; pero la mayoría de los servicios proporciona código basado en "iframes" que sí funciona. Entre las incrustaciones válidas se encuentran las de YouTube, Vimeo o Dailymotion.

Utilizar widgets

Al editar el contenido de la página en modo experto, tal vez desee utilizar la biblioteca ODS-Widgets, que es un conjunto de componentes disponibles en forma de elementos HTML que permiten integrar visualizaciones de datos de forma nativa en el código de la página, así como crear páginas interactivas combinando varios widgets.

La biblioteca ODS-Widgets es un marco de código abierto basado en AngularJS, desarrollado y mantenido por Opendatasoft en GitHub. Incorpora una extensa y completa documentación en línea.

Puede usarse directamente en las páginas de contenido del dominio, o en sitios web de terceros como un kit de herramientas independiente.

Nota

Pese a basarse en AngularJS, ODS-Widgets se ha concebido para usar como un conjunto de elementos HTML; por consiguiente, se utilizan íntegramente en código HTML, sin JavaScript. Por lo tanto, cualquier usuario con nociones de HTML podrá utilizarlo, sin que requiera habilidades de desarrollo. Además, como muchas visualizaciones de Opendatasoft proporcionan el código equivalente de los widgets en tiempo real cuando se utilizan en el portal, puede aprender empezando con el resultado de una visualización e iterando desde ahí.

Además de todos los widgets que ofrece la biblioteca ods-widgets, algunas directivas adicionales están disponibles para el uso en las páginas de contenido de la plataforma. A diferencia de los widgets, estas no se pueden usar en sitios web de terceros ya que están estrechamente unidas a la plataforma.

Lista de widgets

odsAggregation

  • Este widget expone los resultados de una función de agregación en un campo de juego de datos. Por ejemplo, se puede usar para exponer la temperatura promedio de un juego de datos de meteorología. El resultado se expone en una variable nueva que se puede usar en otros widgets o directamente en el código HTML.

  • Documentación completa de

odsAnalysis

  • Este widget expone los resultados de varias agregaciones en un eje. Como en un gráfico, para cada uno de los valores del eje X, calcula las funciones de agregación. Se puede usar junto con ngRepeat de AngularJS para crear una tabla de los resultados de análisis.

  • Documentación completa de

  • Relacionado con odsAnalysisSerie

odsBreezometer

odsCalendar

  • Este widget puede tomar cualquier juego de datos que contenga como mínimo 2 campos de fecha y hora y 1 campo de texto, y utilizarlo para visualizar un calendario. Puede cargar 1.000 eventos (registros) a la vez como máximo.

  • Documentación completa de

odsCatalogContext

  • Un "contexto de catálogo" representa todo el catálogo (lista) de juegos de datos de un dominio específico, y un conjunto de parámetros utilizados para consultar este catálogo.

  • Documentación completa de

odsChart

  • Este widget es el widget de base que permite visualizar gráficos a partir de juegos de datos de Opendatasoft. Un gráfico se define mediante una o varias series que obtienen sus datos de uno o varios juegos de datos representados por un contexto de juego de datos, un tipo de gráfico y varios parámetros para la personalización de la apariencia del gráfico.

  • Documentación completa de

  • Relacionado con odsChartQuery y odsChartSerie

odsClearAllFilters

odsDatasetCard

  • Si esta directiva envuelve un elemento o un conjunto de elementos, se visualizará una tarjeta ampliable sobre este para mostrar el título y la descripción del juego de datos, junto con un vínculo con el portal que visualiza el juego de datos, y la licencia asociada a los datos.

  • Documentación completa de

odsDatasetContext

  • Un "contexto de juego de datos" representa un juego de datos, y un conjunto de parámetros utilizados para consultar sus datos. Un contexto puede ser usado por una o varias directivas, a fin de compartir información (habitualmente, los parámetros de consulta).

  • Documentación completa de

odsDatetime

odsDisqus

  • Este widget muestra un panel de Disqus en que los usuarios pueden comentar la página.

  • Documentación completa de

  • Más información acerca de Configurar Disqus /!pendiente de escribir

odsDomainStatistics

  • Este widget enumera los valores estadísticos de un catálogo específico y los inserta como variables en el contexto.

  • Documentación completa de

odsFacetResults

  • Este widget captura los resultados de la enumeración de los valores ("categorías") de una faceta, y los expone en una variable disponible en el ámbito. Se puede usar junto con ngRepeat de AngularJS para crear una lista de resultados.

  • Documentación completa de

odsFacets

  • Este widget visualiza los filtros (facetas) de un juego de datos o el catálogo de juegos de datos de un dominio, lo que permite a los usuarios "refinar" dinámicamente en una o más categorías del contexto.

  • Documentación completa de

odsFilterSummary

  • Este widget visualiza un resumen de todos los filtros activos en un contexto: búsqueda de texto, refinamientos...

  • Documentación completa de

odsGauge

  • Este widget visualiza un medidor de uno de los 2 modos siguientes: círculo o barra horizontal. El widget utiliza CSS3 y SVG y, por consiguiente, es totalmente personalizable en CSS.

  • Documentación completa de

odsGeoSearch

  • Este widget visualiza un minimapa con una herramienta de dibujo de rectángulo que se puede emplear para buscar en un catálogo.

  • Documentación completa de

odsGeotooltip

  • Cuando se utiliza para delimitar un texto, esta directiva visualiza una ayuda de herramienta que muestra un punto y/o una forma en un mapa.

  • Documentación completa de

odsHubspotForm

odsInfiniteScrollResults

  • Este widget visualiza los resultados de una consulta en una lista con todos los resultados en una página. Utiliza la plantilla HTML dentro de la etiqueta de widget y la repite para cada uno de los resultados.

  • Documentación completa de

odsLastDatasetsFeed

  • Este widget visualiza los últimos juegos de datos de un catálogo (valor predeterminado: 5 últimos) en función de los metadatos modificados.

  • Documentación completa de

odsLastReusesFeed

  • Este widget visualiza las últimas reutilizaciones publicadas en un dominio (valor predeterminado: 5).

  • Documentación completa de

odsMap

  • Este widget permite crear una visualización de mapa y mostrar los datos en diversos modos de visualización mediante capas. Cada una de las capas se basa en un contexto de juego de datos, un modo de visualización (clústeres...) y diversas propiedades para definir la visualización en sí, como los colores.

  • Documentación completa de

odsMediaGallery

  • Este widget visualiza una galería de imágenes de un juego de datos que contiene medios con miniaturas (imágenes, archivos pdf...) con todos los resultados en una página.

  • Documentación completa de

odsMostPopularDatasets

  • Este widget visualiza los juegos de datos principales de un catálogo (valor predeterminado: 5 juegos de datos principales) según el número de descargas.

  • Documentación completa de

odsMostUsedThemes

odsPicto

  • Este widget visualiza un "pictograma" especificado por una dirección URL y fuerza que se le aplique un color de relleno. Se puede personalizar el estilo de este elemento (altura, anchura...), especialmente si el pictograma es vectorial (SVG).

  • Documentación completa de

odsPlumeAirQuality

odsRecordImage

odsRedirectIfNotLoggedIn

  • Este widget fuerza la redirección a la página de inicio de sesión del dominio si el usuario no tiene iniciada la sesión.

  • Documentación completa de

odsResultEnumerator

  • Este widget enumera los resultados de una búsqueda (registros para un contexto de juego de datos y juegos de datos para un contexto de catálogo), y repite la plantilla (el contenido del elemento de directiva) para cada uno de ellos.

  • Documentación completa de

odsResults

  • Este widget expone los resultados de una búsqueda (como una matriz) en una variable disponible en el ámbito. Se puede usar junto con ngRepeat de AngularJS para crear una lista de resultados.

  • Documentación completa de

odsReuses

  • Este widget visualiza todas las reutilizaciones publicadas en un dominio, en una lista infinita de cuadros grandes que las presenta en una visualización clara. Las listas muestran primero las reutilizaciones más recientes.

  • Documentación completa de

odsSearchbox

  • Este widget visualiza un cuadro de búsqueda amplio que redirige la búsqueda en la página principal Explorar del dominio.

  • Documentación completa de

odsSocialButtons

  • Este widget visualiza un botón de compartir que al pasar por encima mostrará los botones de compartir en las redes sociales.

  • Documentación completa de

odsSpinner

  • Este widget visualiza el control de número de Opendatasoft personalizado. Su tamaño y color coinciden con la fuente actual.

  • Documentación completa de

odsTable

  • Este widget visualiza una vista de tabla de un juego de datos, con todos los resultados en una página y la posibilidad de ordenar las columnas (según los tipos de columna).

  • Documentación completa de

odsTagCloud

  • Este widget visualiza una "nube de etiquetas" de los valores disponibles en una faceta (la faceta de un juego de datos o una faceta del catálogo de juego de datos).

  • Documentación completa de

odsTextSearch

  • Este widget visualiza un cuadro de búsqueda que se puede utilizar para efectuar una búsqueda de texto completo en un contexto.

  • Documentación completa de

odsThemeBoxes

  • Este widget enumera los temas disponibles en el dominio, mostrando sus pictogramas y el número de juegos de datos que contienen.

  • Documentación completa de

odsThemePicto

odsTimerange

odsTimescale

  • Visualiza un control para seleccionar uno de estos: último día, última semana, último mes o último año.

  • Documentación completa de

odsTopPublishers

odsTwitterTimeline

Filtros

Además de los filtros AngularJS, la biblioteca de widgets de Opendatasoft incluye otros adicionales que se pueden utilizar en páginas personalizadas:
capitalize, fieldsFilter, firstValue, imageify, imageUrl, isAfter, isBefore, isDefined, isEmpty, join, keys, moment, momentadd, momentdiff, nofollow, normalize, numKeys, shortSummary, slugify, split, stringify, themeColor, themeSlug, thumbnailUrl, timesince, toObject, truncate, values, videoify