For some reason vega is reading my data as 0 when the numbers range from 1-234.
I am attempting to show a visualisation of a chloropleth map of crypto-ownership by country.
The countries have been ranked 1-234 and that is meant to show on the tooltip however, this is being shown as 0 on the tooltip. How do I fix this.
Here is my code:
{
"$schema": "https://vega.github.io/schema/vega-lite/v5.json",
"title":{
"text": "Crypto Ownership Worldwide",
"subtitle": "Source: FILL",
"anchor": "start"
},
"width":500,
"height":400,
"data": {
"url": "https://raw.githubusercontent.com/tomiwav/tomiwav.github.io/main/custom.geo%20(3).json",
"format":{"property": "features"}
},
"projection":{"type": "mercator"},
"transform": [
{
"lookup":"properties.name",
"from":{
"key": "Country",
"fields": ["Rank"],
"data":{
"url": "https://raw.githubusercontent.com/tomiwav/tomiwav.github.io/main/datarank.csv",
"format":{"type":"csv"}
}
}
}
],
"mark":{
"type": "geoshape",
"fill":"lightgray",
"stroke":"black",
"strokeWidth":0.5
},
"encoding": {
"color": {
"field": "Rank",
"type": "quantitative",
"scale": {
"domain":[234,1],
"scheme": "oranges"
}
},
"tooltip":[
{"field":"properties.name", "title":"Country"},
{"field":"Rank","type":"quantitative","title":"Number of Crypto Owners","format":".2f"}
]
},
"config": {"mark": {"invalid": null}
}
}
Your lookup was failing. You need a lower case "c" on country.
{
"$schema": "https://vega.github.io/schema/vega-lite/v5.json",
"title": {
"text": "Crypto Ownership Worldwide",
"subtitle": "Source: FILL",
"anchor": "start"
},
"width": 500,
"height": 400,
"data": {
"url": "https://raw.githubusercontent.com/tomiwav/tomiwav.github.io/main/custom.geo%20(3).json",
"format": {"property": "features"}
},
"projection": {"type": "mercator"},
"transform": [
{
"lookup": "properties.name",
"from": {
"key": "country",
"fields": ["Rank"],
"data": {
"url": "https://raw.githubusercontent.com/tomiwav/tomiwav.github.io/main/datarank.csv",
"format": {"type": "csv"}
} }
}
],
"mark": {
"type": "geoshape",
"fill": "lightgray",
"stroke": "black",
"strokeWidth": 0.5
},
"encoding": {
"color": {
"field": "Rank",
"type": "quantitative",
"scale": {"domain": [234, 1], "scheme": "oranges"}
},
"tooltip": [
{"field": "properties.name", "title": "Country"},
{
"field": "Rank",
"type": "quantitative",
"title": "Number of Crypto Owners",
"format": ".2f"
}
]
},
"config": {"mark": {"invalid": null}}
}
I have created a form using below json configuration for react-jsonschema-form
{
"schema": {
"title": "Employee Detail",
"type": "object",
"required": ["name", "email", "country"],
"properties": {
"name": {
"type": "string",
"title": "Name",
"default": "",
"autoComplete": "off"
},
"email": {
"type": "string",
"title": "Email",
"default": ""
},
"registeredAddress": {
"type": "object",
"title": "Registered Address",
"properties": {
"line1": {
"type": "string",
"title": "Address Line1",
"default": ""
},
"line2": {
"type": "string",
"title": "Address Line2",
"default": ""
},
"city": {
"type": "string",
"title": "City",
"default": ""
},
"postal": {
"type": "string",
"title": "Postal",
"default": ""
},
"country": {
"type": "string",
"title": "Country",
"default": "",
"enum": ["IN", "PK", "CN"],
"enumNames": ["India", "Pakistan", "China"]
}
}
},
"isAddressDifferent": {
"type": "boolean",
"title": "Is Mailing Address different from Registered Address",
"default": false
},
"about": {
"type": "string",
"title": "About",
"default": "",
"autoComplete": "off"
}
},
"if": {
"properties": {
"isAddressDifferent": {
"const": true
}
}
},
"then": {
"properties": {
"mailingAddress": {
"type": "object",
"title": "Mailing Address",
"properties": {
"line1": {
"type": "string",
"title": "Address Line1",
"default": ""
}
}
}
}
}
}
}
I am hiding mailingAddress property on the basis of isAddressDifferent checkbox value, but I want to position mailingAddress on ui after that checkbox and above the about ui widget
Can anyone help me on this?
Below is the codesandbox url for code
https://codesandbox.io/s/rjfs-form-demo-mix96s?file=/src/custom-form/form-config.json
I am creating Alexa echo show skill, I have created one sample Alexa skill without lambda function that hits myserver api and I return response in Alexa accepted format like below:
{
"version": "1.0",
"sessionAttributes": {},
"response": {
"outputSpeech": {
"type": "PlainText",
"text": "My output speech"
},
"card": {
"type": "Simple",
"title": "hELLO",
"content": "Meetings"
},
"reprompt": {
"outputSpeech": {
"type": "PlainText",
"text": "Can I help you with anything else?"
}
},
"shouldEndSession": false
}
}
Till now my skill working fine, But now I want to show a template over the echo show that is possible with APL(Alexa Programming Language).
I am not getting APL examples without lambda function, I have tried to add some APL response json from the example that i got and put into above response json that is not working.
I am confused with APL, Should i just need to add some attribute only in the above response or need to use sdk at my server that is running with PHP whose sdk i did not find at the portal.
Please help me
If you want to send an APL document, you have to send a directive to the JSON
{
"body": {
"version": "1.0",
"response": {
"outputSpeech": {
"type": "SSML",
"ssml": "<speak>Hello world, change me</speak>"
},
"directives": [
{
"type": "Alexa.Presentation.APL.RenderDocument",
"token": "TemplateTypescript",
"document": {
"type": "APL",
"version": "1.7",
"license": "Copyright 2021 Amazon.com, Inc. or its affiliates. All Rights Reserved.\nSPDX-License-Identifier: LicenseRef-.amazon.com.-AmznSL-1.0\nLicensed under the Amazon Software License http://aws.amazon.com/asl/",
"theme": "dark",
"import": [
{
"name": "alexa-layouts",
"version": "1.4.0"
}
],
"resources": [
{
"description": "Default dimensions, numbers and strings for the AlexaHeadline.",
"dimensions": {
"primaryTextMaxWidth": "100%",
"secondaryTextMaxWidth": "100%",
"secondaryTextTopPadding": "#spacingXSmall",
"contentPaddingLeft": "#marginHorizontal"
},
"numbers": {
"headlinePrimaryTextMaxLines": 2
},
"strings": {
"textComponentAlign": "center"
}
},
{
"description": "Dimensions for the AlexaHeadline - hubLandscapeLarge.",
"when": "${#viewportProfile == #hubLandscapeLarge}",
"numbers": {
"headlinePrimaryTextMaxLines": 4
}
},
{
"description": "Dimensions for the AlexaHeadline - hubRound.",
"when": "${#viewportProfileCategory == #hubRound}",
"dimensions": {
"secondaryTextTopPadding": "#spacing3XSmall"
}
},
{
"description": "Dimensions for the AlexaHeadline - tvLandscapeOverlay/tvLandscapeXLarge.",
"when": "${#viewportProfile == #tvLandscapeXLarge || #viewportProfile == #tvLandscapeOverlay}",
"dimensions": {
"primaryTextMaxWidth": "560dp",
"secondaryTextMaxWidth": "560dp",
"secondaryTextTopPadding": "#spacing3XSmall"
}
},
{
"description": "Dimensions for the AlexaHeadline - tvLandscapeXLarge.",
"when": "${#viewportProfile == #tvLandscapeXLarge}",
"numbers": {
"headlinePrimaryTextMaxLines": 4
}
},
{
"description": "Dimensions, numbers and strings for the AlexaHeadline - tvPortraitOverlay.",
"when": "${#viewportProfile == #tvPortraitOverlay}",
"dimensions": {
"primaryTextMaxWidth": "220dp",
"secondaryTextMaxWidth": "220dp",
"contentPaddingLeft": "#spacing2XLarge"
},
"strings": {
"textComponentAlign": "left"
}
},
{
"description": "Dimensions, numbers and strings for the AlexaHeadline - mobileSmall portrait.",
"when": "${#viewportProfile == #mobileSmall && #viewportOrientation == #viewportOrientationPortrait}",
"numbers": {
"headlinePrimaryTextMaxLines": 4
}
},
{
"description": "Dimensions, numbers and strings for the AlexaHeadline - mobileMedium.",
"when": "${#viewportProfile == #mobileMedium}",
"dimensions": {
"primaryTextMaxWidth": "758dp"
},
"numbers": {
"headlinePrimaryTextMaxLines": 4
}
},
{
"description": "Dimensions, numbers and strings for the AlexaHeadline - mobileLarge.",
"when": "${#viewportProfile == #mobileLarge}",
"dimensions": {
"primaryTextMaxWidth": "1025dp"
},
"numbers": {
"headlinePrimaryTextMaxLines": 4
}
},
{
"description": "Dimensions, numbers and strings for the AlexaHeadline - hubPortraitMedium.",
"when": "${#viewportProfile == #hubPortraitMedium}",
"numbers": {
"headlinePrimaryTextMaxLines": 4
}
},
{
"description": "Dimensions, numbers and strings for the AlexaHeadline - hubLandscapeXLarge.",
"when": "${#viewportProfile == #hubLandscapeXLarge}",
"dimensions": {
"primaryTextMaxWidth": "1440dp"
},
"numbers": {
"headlinePrimaryTextMaxLines": 4
}
}
],
"styles": {
"primaryTextLight": {
"extends": "textStyleDisplay4",
"values": [
{
"color": "#colorTextReversed"
}
]
},
"secondaryTextLight": {
"extends": "textStyleCallout",
"values": [
{
"color": "#colorTextReversed"
}
]
}
},
"layouts": {
"AlexaHeadline": {
"parameters": [
{
"name": "theme",
"description": "Colors will be switched depending on the specified theme (light/dark). Default to dark theme",
"type": "string",
"default": "dark"
},
{
"name": "primaryText",
"description": "Primary message",
"type": "string"
},
{
"name": "secondaryText",
"description": "secondary message",
"type": "string"
},
{
"name": "headerAttributionOpacity",
"type": "number",
"default": "${#viewportProfileCategory == #hubRound ? 1 : #opacitySecondary}"
},
{
"name": "headerTitle",
"description": "Primary text to render in header.",
"type": "string"
},
{
"name": "headerSubtitle",
"description": "Secondary text to render in header.",
"type": "string"
},
{
"name": "headerAttributionText",
"description": "Attribution text to render in header. Only shown when no headerAttributionImage is provided, and when headerAttributionPrimacy is true, or on a device that shows Title/Subtitle and Attribution.",
"type": "string"
},
{
"name": "headerAttributionImage",
"description": "URL for attribution image source. Only shown when headerAttributionPrimacy is true, or on a device that shows Title/Subtitle and Attribution.",
"type": "string"
},
{
"name": "headerAttributionPrimacy",
"description": "On devices that can only display one element due to screen size, Attribution is prioritized. Setting False displays Title/Subtitle. Defaults to true.",
"type": "boolean",
"default": true
},
{
"name": "headerDivider",
"description": "Toggle to display the divider that appears at the bottom of header to help separate it from the content below. Default to false",
"type": "boolean",
"default": false
},
{
"name": "headerBackButton",
"description": "Toggle to display back button in header. Defaults to false.",
"type": "boolean",
"default": false
},
{
"name": "headerBackButtonAccessibilityLabel",
"description": "An accessibility label to describe the back button to customers who use a screen reader.",
"type": "string"
},
{
"name": "headerBackButtonCommand",
"description": "Command that is issued when back button is pressed.",
"type": "any",
"default": {
"type": "SendEvent",
"arguments": ["goBack"]
}
},
{
"name": "headerBackgroundColor",
"description": "Optional color value to use as background color for Header. Defaults to transparent.",
"type": "color",
"default": "transparent"
},
{
"name": "backgroundColor",
"description": "Color value to use as background color for layout.",
"type": "color"
},
{
"name": "backgroundImageSource",
"description": "URL for background image source.",
"type": "string"
},
{
"name": "backgroundVideoSource",
"description": "URL for background video source.",
"type": "any"
},
{
"name": "backgroundScale",
"description": "Image/video scale to apply to background image/video. Defaults to best-fill.",
"type": "string",
"default": "best-fill"
},
{
"name": "backgroundAlign",
"description": "Image/video alignment to apply to background image/video. Defaults to center.",
"type": "string",
"align": "center"
},
{
"name": "backgroundBlur",
"description": "Toggle to apply background blur. Defaults to false.",
"type": "boolean",
"default": false
},
{
"name": "backgroundColorOverlay",
"description": "Toggle to apply overlay scrim to background image/video. Defaults to false.",
"type": "boolean",
"default": false
},
{
"name": "backgroundOverlayGradient",
"description": "Toggle to apply gradient to background image/video. Defaults to false.",
"type": "boolean",
"default": false
},
{
"name": "backgroundVideoAutoPlay",
"description": "Toggle to autoplay background video(s). Defaults to false.",
"type": "boolean",
"default": false
},
{
"name": "backgroundVideoAudioTrack",
"description": "Audio track to play on. Defaults to foreground. EM can select foreground | background | none.",
"type": "string",
"default": "foreground"
},
{
"name": "footerHintText",
"type": "string",
"description": "Hint text to display in Footer."
},
{
"name": "entities",
"description": "Array of entity data bind to this layout",
"type": "any"
},
{
"name": "layoutDirection",
"description": "The layoutDirection of AlexaHeadline. It can be LTR or RTL. By default, it uses environment layoutDirection.",
"type": "string",
"default": "${environment.layoutDirection}"
},
{
"name": "lang",
"description": "The lang property of AlexaHeadline. Set the lang property to a BCP-47 string (e.g., en-US). By default, it uses environment lang.",
"type": "string",
"default": "${environment.lang}"
}
],
"items": [
{
"type": "Container",
"layoutDirection": "${layoutDirection}",
"height": "100vh",
"entities": "${entities}",
"items": [
{
"type": "AlexaBackground",
"backgroundColor": "${backgroundColor}",
"backgroundImageSource": "${backgroundImageSource}",
"backgroundVideoSource": "${backgroundVideoSource}",
"backgroundScale": "${backgroundScale}",
"backgroundAlign": "${backgroundAlign}",
"backgroundBlur": "${backgroundBlur}",
"colorOverlay": "${backgroundColorOverlay}",
"overlayGradient": "${backgroundOverlayGradient}",
"videoAutoPlay": "${backgroundVideoAutoPlay}",
"videoAudioTrack": "${backgroundVideoAudioTrack}"
},
{
"type": "Container",
"height": "100vh",
"width": "100vw",
"position": "absolute",
"items": [
{
"type": "Container",
"grow": 1,
"justifyContent": "center",
"paddingLeft": "#contentPaddingLeft",
"paddingRight": "#marginHorizontal",
"alignItems": "center",
"items": [
{
"when": "${primaryText && primaryText != ''}",
"type": "Text",
"style": "${theme == 'light' ? 'primaryTextLight' : 'textStyleDisplay4'}",
"text": "${primaryText}",
"opacity": 1,
"textAlign": "#textComponentAlign",
"maxWidth": "#primaryTextMaxWidth",
"maxLines": "#headlinePrimaryTextMaxLines"
},
{
"when": "${secondaryText && secondaryText != ''}",
"type": "Text",
"style": "${theme == 'light' ? 'secondaryTextLight' : 'textStyleCallout'}",
"text": "${secondaryText}",
"maxLines": 1,
"opacity": "#opacitySecondary",
"textAlign": "#textComponentAlign",
"maxWidth": "#secondaryTextMaxWidth",
"paddingTop": "#secondaryTextTopPadding"
}
]
},
{
"type": "AlexaHeader",
"theme": "${theme}",
"headerTitle": "${headerTitle}",
"layoutDirection": "${layoutDirection}",
"headerSubtitle": "${#viewportProfile != #tvLandscapeOverlay ? headerSubtitle : ''}",
"headerAttributionText": "${headerAttributionText}",
"headerAttributionImage": "${headerAttributionImage}",
"headerAttributionPrimacy": "${headerAttributionPrimacy}",
"headerDivider": "${headerDivider}",
"headerBackButton": "${headerBackButton}",
"headerBackButtonAccessibilityLabel": "${headerBackButtonAccessibilityLabel}",
"headerBackButtonCommand": "${headerBackButtonCommand}",
"headerBackgroundColor": "${headerBackgroundColor}",
"headerAttributionOpacity": "${headerAttributionOpacity}",
"position": "absolute",
"width": "100%",
"top": "0"
},
{
"when": "${#viewportProfileCategory != #hubRound && #viewportProfile != #tvLandscapeOverlay && footerHintText}",
"type": "AlexaFooter",
"hintText": "${footerHintText}",
"theme": "${theme}",
"lang": "${lang}",
"position": "absolute",
"width": "100%",
"bottom": "0"
}
]
}
]
}
]
}
},
"mainTemplate": {
"parameters": ["payload"],
"item": [
{
"type": "AlexaHeadline",
"id": "PlantHeadline",
"primaryText": "${payload.headlineTemplateData.properties.textContent.primaryText.text}",
"headerBackButton": false,
"headerAttributionImage": "${payload.headlineTemplateData.properties.logoUrl}",
"headerAttributionPrimacy": true,
"footerHintText": "${payload.headlineTemplateData.properties.hintText}",
"backgroundImageSource": "${payload.headlineTemplateData.properties.backgroundImage.sources[0].url}",
"backgroundColorOverlay": false,
"speech": "${payload.headlineTemplateData.properties.welcomeSpeech}",
"theme": "light"
}
]
},
"onMount": [
{
"type": "SpeakItem",
"componentId": "PlantHeadline"
}
]
},
"datasources": {
"headlineTemplateData": {
"type": "object",
"objectId": "headlineSample",
"properties": {
"backgroundImage": {
"sources": [
{
"url": "https://d2o906d8ln7ui1.cloudfront.net/images/templates_v3/headline/HeadlineBackground_Light.png",
"size": "large"
}
]
},
"textContent": {
"primaryText": {
"type": "PlainText",
"text": "Welcome to Template Typescript"
}
},
"logoUrl": "",
"hintText": ""
}
}
},
"timeoutType": "SHORT"
}
],
"reprompt": {
"outputSpeech": {
"type": "SSML",
"ssml": "<speak>Hello world, change me</speak>"
}
},
"shouldEndSession": false,
"type": "_DEFAULT_RESPONSE"
},
"sessionAttributes": {},
"userAgent": "ask-node/2.11.0 Node/v12.22.4"
}
}
You can use https://apl.ninja/ or within the developer console to help you get started quickly.
I have to index a json to Elastic which look like the below format. My problem is that the key "variable" is array that contains json objects (I thought about "nested" datatype of Elastic) but some of those objects it's possible to contain nested json arrays inside them. (see variable CUSTOMERS).
POST /example_data/data {
"process_name": "TEST_PROCESS",
"process_version ": 0,
"process_id": "1111",
"activity_id": "111",
"name": "update_data",
"username": "testUser",
"datetime": "2018-01-01 10:00:00",
"variables": [{
"name": "ΒΑΝΚ",
"data_type": "STRING",
"value": "EUROBANK"
},{
"name": "CITY",
"data_type": "STRING",
"value": "LONDON"
}, {
"name": "CUSTOMERS",
"data_type": "ENTITY",
"value": [{
"variables": [{
"name": "CUSTOMER_NAME",
"data_type": "STRING",
"value": "JOHN"
}, {
"name": " CUSTOMER_CITY",
"data_type": "STRING",
"value": "LONDON"
}
]
}
]
}, {
"name": "CUSTOMERS",
"data_type": "ENTITY",
"value": [{
"variables": [{
"name": "CUSTOMER_NAME",
"data_type": "STRING",
"value": "ΑΘΗΝΑ"
}, {
"name": " CUSTOMER_CITY ",
"data_type": "STRING",
"value": "LIVERPOOL"
}, {
"name": " CUSTOMER_NUMBER",
"data_type": "STRING",
"value": "1234567890"
}
]
}
]
}
] }
When I'm trying to index it I get the following error
{ "error": {
"root_cause": [
{
"type": "illegal_argument_exception",
"reason": "Can't merge a non object mapping [variables.value] with an object mapping [variables.value]"
}
],
"type": "illegal_argument_exception",
"reason": "Can't merge a non object mapping [variables.value] with an object mapping [variables.value]" }, "status": 400 }
Mapping
{ "example_data": {
"mappings": {
"data": {
"properties": {
"activity_id": {
"type": "text"
},
"name": {
"type": "text"
},
"process_name": {
"type": "text"
},
"process_version": {
"type": "integer"
}
"process_id": {
"type": "text"
},
"datetime": {
"type": "date",
"format": "yyyy-MM-dd HH:mm:ss"
},
"username": {
"type": "text",
"analyzer": "greek"
},
"variables": {
"type": "nested",
"properties": {
"data_type": {
"type": "text",
"fields": {
"keyword": {
"type": "keyword",
"ignore_above": 256
}
}
},
"name": {
"type": "text",
"fields": {
"keyword": {
"type": "keyword",
"ignore_above": 256
}
}
},
"value": {
"type": "text",
"fields": {
"keyword": {
"type": "keyword",
"ignore_above": 256
}
}
}
}
}
}
}
}}}
When I remove the variable CUSTOMERS that contains the array, then It works properly because there are only json objects.
Is there a way to handle that? Thanks in advance
Forms do not render if only datepicker fields exist.
I am using the Datepicker addon.
The following does not render
//schema
{
"type": "object",
"properties": {
"date_complete": {
"type": "string",
"required": true,
"format": "date"
},
"close_date": {
"type": "string",
"required": true,
"format": "date"
}
}
}
//form
[
{
"key": "date_complete",
"title": "Completed Date",
"type": "datepicker",
"readonly": false,
"description": "Please Supply The Date This Task Was Completed.",
"format": "mm/dd/yyyy"
},
{
"key": "close_date",
"title": "Close Date",
"type": "datepicker",
"readonly": false,
"description": "Please Supply The Close Date.",
"format": "mm/dd/yyyy"
}
]
If I add a basic text field into the mix the form renders fine.
//schema
{
"type": "object",
"properties": {
"date_complete": {
"type": "string",
"required": true,
"format": "date"
},
"close_date": {
"type": "string",
"required": true,
"format": "date"
},
"basicfield": {
"type": "string"
}
}
}
//form
[
{
"key":"date_complete",
"title": "Completed Date",
"type": "datepicker",
"readonly": false,
"description": "Please Supply The Date This Was Completed.",
"format": "mm/dd/yyyy",
"required": true
},{
"key": "close_date",
"title": "Close Date",
"type": "datepicker",
"readonly": false,
"description": "Please Supply The Close Date.",
"format": "mm/dd/yyyy",
"required": true
},
{
"key":"basicfield",
"title": "basicfield"
}
]
Any help is appreciated.
Added this after setting schema/form in $scope.
Feels Hacky...
$timeout(100, ()=>$scope.$broadcast('schemaFormRedraw'));