Openlayers 3 GeoJSON coordinates shows wrong result - angularjs

I am using angular-openlayers-directive to build my project.
I try to rewrite the example of geojson part cause I will get point information dynamically. So I made the source part of geojson inside instead of loading from json file. However, the position of my code is totally different as I expect.
The result suppose to show a point at that coordinate I set. But the point is like at the [0, 0]. If I change the to use loading from the json file, that will work.
I have no idea why the coordinate change so much. If anyone know the reason why, please let me know! I will appreciate that.
The following is my code:
source: {
type: "GeoJSON",
projection: 'EPSG:4326',
geojson: {
object: {
type: "FeatureCollection",
features: [{
type: "Feature",
id: "TWN",
properties: {
name: "Taiwan"
},
geometry: {
type: "Point",
coordinates: [25.038507, 121.525527]
}
}]
}
}
//url: 'json/ESP.geo.json'
}

The GeoJSON you've supplied is invalid. GeoJSON coordinates pairs are in the form of longitude/latitude, not latitude/longitude as you've used for Taiwan. Switch them and you'll be fine.

There is an error in the placement of the 'projection' attribute. The answer below shows the correct one.
source: {
type: "GeoJSON",
geojson: {
object: {
type: "FeatureCollection",
features: [{
type: "Feature",
id: "TWN",
properties: {
name: "Taiwan"
},
geometry: {
type: "Point",
coordinates: [25.038507, 121.525527]
}
}]
},
projection: 'EPSG:4326',
}
}

Related

Unable to add code blocks in Sanity CMS after I install the code-input plugin

I am learning to build a blog using Sanity CMS and React. I am new to Sanity.
I should be able to insert code snippets in my blog posts. So, I have installed the code-input plugin.
According to the link here, after I install the plugin I have to use the following code in my schema types.
I have no idea where do I insert the code.
Please help.
My folder structure is as follows:
sanityblog/blockContent.js
/**
* This is the schema definition for the rich text fields used for
* for this blog studio. When you import it in schemas.js it can be
* reused in other parts of the studio with:
* {
* name: 'someName',
* title: 'Some title',
* type: 'blockContent'
* }
*/
export default {
title: "Block Content",
name: "blockContent",
type: "array",
of: [
{
title: "Block",
type: "block",
// Styles let you set what your user can mark up blocks with. These
// correspond with HTML tags, but you can set any title or value
// you want and decide how you want to deal with it where you want to
// use your content.
styles: [
{ title: "Normal", value: "normal" },
{ title: "H1", value: "h1" },
{ title: "H2", value: "h2" },
{ title: "H3", value: "h3" },
{ title: "H4", value: "h4" },
{ title: "Quote", value: "blockquote" },
],
lists: [{ title: "Bullet", value: "bullet" }],
// Marks let you mark up inline text in the block editor.
marks: {
// Decorators usually describe a single property – e.g. a typographic
// preference or highlighting by editors.
decorators: [
{ title: "Strong", value: "strong" },
{ title: "Emphasis", value: "em" },
],
// Annotations can be any object structure – e.g. a link or a footnote.
annotations: [
{
title: "URL",
name: "link",
type: "object",
fields: [
{
title: "URL",
name: "href",
type: "url",
},
],
},
],
},
},
// You can add additional types here. Note that you can't use
// primitive types such as 'string' and 'number' in the same array
// as a block type.
{
type: "image",
options: { hotspot: true },
},
],
};
sanityblog/schema.js
// First, we must import the schema creator
import createSchema from "part:#sanity/base/schema-creator";
// Then import schema types from any plugins that might expose them
import schemaTypes from "all:part:#sanity/base/schema-type";
// We import object and document schemas
import blockContent from "./blockContent";
import category from "./category";
import post from "./post";
import author from "./author";
// Then we give our schema to the builder and provide the result to Sanity
export default createSchema({
// We name our schema
name: "default",
// Then proceed to concatenate our document type
// to the ones provided by any plugins that are installed
types: schemaTypes.concat([
// The following are document types which will appear
// in the studio.
post,
author,
category,
// When added to this list, object types can be used as
// { type: 'typename' } in other document schemas
blockContent,
]),
});
If you installed the plugin correctly, it's now available as a schema type to be used in any of your other schemas. So, to answer your question, you can put that code anywhere you want code blocks in your Sanity studio. I'd strongly suggest going over the content modelling documentation 😉
Specifically to your question, assuming you use the sanityBlog/blockContent.js field for the content of your posts, you can add it there. Here's how that would look like:
export default {
title: "Block Content",
name: "blockContent",
type: "array",
of: [
{
title: "Block",
type: "block",
// ...annotations, styles, lists and marks you already have
},
{
type: "image",
options: { hotspot: true },
},
// Add the code block here 👇
// it'll show up as one of the blocks available in your
// Portable Text Editor
{
type: "code",
title: "Code block",
}
],
};
For specifics on the portable text / rich content field (type: "block"), refer to the block type documentation. If you want to take it one step back, refer to the general block content documentation.
Hope this helps 🙌

How to normalize the data from the JSON with normalizr?

I am quite new to the normalizr and can't understand it well enough yet. How can I normalize the following JSON response so it can be used for the Redux:
{
"statusCode":200,
"message":"Random quotes",
"pagination":{
"currentPage":1,
"nextPage":null,
"totalPages":1
},
"totalQuotes":1,
"data":[
{
"_id":"5eb17aadb69dc744b4e70e05",
"quoteText":"One crowded hour of glorious life is worth an age without a name.",
"quoteAuthor":"Walter Scott",
"quoteGenre":"age",
"__v":0
}
]
}
It would be useful to put the data object at the top level in the normalized object.
How can I combine this with TypeScript?
Thank you in advance.
Typescript types can definitely help you to understand the data that you are dealing with. You want to describe various pieces of the response with their own types and then piece them together.
interface Quote {
_id: string;
quoteText: string;
quoteAuthor: string;
quoteGenre: string;
__v: number;
}
interface Pagination {
currentPage: number;
nextPage: null | number; // what is this when it's not null?
totalPages: number;
}
interface APIResponse {
statusCode: number;
message: string;
pagination: Pagination;
totalQuotes: number;
data: Quote[];
}
normalizr isn't super helpful here because you only have one entity type which is a Quote. In a sense you have two entity types if you are treating the response itself as an entity. But I'm not sure how you would extract a unique id from it. You'd probably have to add it yourself based on the API path/params since that information is lacking in the JSON.
const quote = new schema.Entity("quote", {}, { idAttribute: "_id" });
const response = new schema.Entity("response", {
data: [quote] // an array of quote entities
});
console.log(normalize({...json, id: "/random-quote"}, response));
This gives you
{
"entities": {
"quote": {
"5eb17aadb69dc744b4e70e05": {
"_id": "5eb17aadb69dc744b4e70e05",
"quoteText": "One crowded hour of glorious life is worth an age without a name.",
"quoteAuthor": "Walter Scott",
"quoteGenre": "age",
"__v": 0
}
},
"response": {
"/random-quote": {
"statusCode": 200,
"message": "Random quotes",
"pagination": {
"currentPage": 1,
"nextPage": null,
"totalPages": 1
},
"totalQuotes": 1,
"data": ["5eb17aadb69dc744b4e70e05"],
"id": "/random-quote"
}
}
},
"result": "/random-quote"
}

Unable to transform the data for rendering line charts: Highcharts+React

I am actually new to this highcharts . Been trying to render a line chart . I am facing issues while transforming the data returned by back-end to the data required by highcharts.
Can someone suggest me how to transform the below data object to the data required by line charts.Trying to plot a graph that compares current and previous values
Help would be appreaciated.
Object
{"data":
[
{"currentVal":3488,"prevVal":0,"timestamp":1554181200000},
{"currentVal":3453,"prevVal":3,"timestamp":1554481200000},
{"currentVal":3456,"prevVal":2,"timestamp":1554581200000}
]
}
As per the documnentaion the line charts data accepts the following structure.
"data": [
{
"name": "currentVal",
"data": [ 7,7,8]
},
{
"name": "prevVal",
"data": [1,6,7]
}
]
}
I would want the help in transforming the object that mentioned in the top
The simplest way to transform the object:
var obj = {
data: [{
"currentVal": 3488,
"prevVal": 3000,
"timestamp": 1554181200000
}, {
"currentVal": 3453,
"prevVal": 3123,
"timestamp": 1554481200000
}, {
"currentVal": 3456,
"prevVal": 3341,
"timestamp": 1554581200000
}]
};
Highcharts.chart('container', {
xAxis: {
type: 'datetime'
},
series: [{
name: "currentVal",
data: obj.data.map(elem => [
elem.timestamp, elem.currentVal
])
}, {
name: "prevVal",
data: obj.data.map(elem => [
elem.timestamp, elem.prevVal
])
}]
});
Demo:
https://jsfiddle.net/BlackLabel/y8efg4hx/1/
https://jsfiddle.net/BlackLabel/0fzjsuLw/1/

MongoDB - AND request on array with GeoJSON element

I've looked at other issues without finding a suitable answer for my problem, so I hope you may help me.
SITUATION
I am currently working on a localisation app with MongoDB. For the moment I test my queries in the MongoDB shell.
I have a collection of Point documents with locations. I use GeoJSON objects for the coordinates of my point.
Here is what a Point document looks like :
{
_id: "Roma_DellArte",
localisations: [
{ location_type_id: 1, location: { type: "Point", coordinates: [ 41.9097306,12.2558141 ] } }
]
}
My location_type_id refers to another collection, juste for you to know.
I already made a query which gets me all the points near a precise location :
db.point.createIndex({ 'localisations.location': "2dsphere" })
db.point.find({
'localisations.location': {
$near: {
$geometry: { type: "Point", coordinates: [ 48.8588377, 2.2770207 ] },
$minDistance: 0,
$maxDistance: 100000
}
}
})
Now I would like to query all the points which are near a precise location AND those with a specific location_type_id.
TRIES AND FAILS
I tried many queries in the MongoDB shell but none of them produced a satisfying result.
Query 1
I think it doesn't return anything because location: isn't an exact field.
db.point.createIndex({ location: "2dsphere" })
db.point.find({
'localisations': {
location_type_id: 1,
location: {
$near: {
$geometry: { type: "Point", coordinates: [ 48.8588377, 2.2770207 ] },
$minDistance: 0,
$maxDistance: 100000
}
}
}
})
Query 2
The main problem here is it gets me a point document if in the localisations field there is an object with a correct location_type_id and an object with the correct location. It is not necessarily the same object, which I want it to be.
see: https://docs.mongodb.com/manual/tutorial/query-array-of-documents/#combination-of-elements-satisfies-the-criteria - second paragraph at the end.
db.point.createIndex({ 'localisations.location': "2dsphere" })
db.point.find({
'localisations.location_type_id': 1,
'localisations.location': {
$near: {
$geometry: { type: "Point", coordinates: [ 48.8588377, 2.2770207 ] },
$minDistance: 0,
$maxDistance: 100000
}
}
})
Query 3
I wanted to try this method : https://docs.mongodb.com/manual/tutorial/query-arrays/#query-for-an-array-element-that-meets-multiple-criteria
db.point.createIndex({ location: "2dsphere" })
db.point.find({
localisations: {
$elemMatch: {
location_type_id: 1,
location: {
$near: {
$geometry: { type: "Point", coordinates: [ 48.8588377, 2.2770207 ] },
$minDistance: 0,
$maxDistance: 100000
}
}
}
}
})
Unfortunately, I get this error:
Error: error: {
"ok" : 0,
"errmsg" : "geoNear must be top-level expr",
"code" : 2,
"codeName" : "BadValue"
}
Now you know everything, I hope you can help me.

How to create sap.m.ComboBox without the strange 'is not a function' error?

I've been playing around with SapUI5 for a while and now I'm facing another issue, which is totally confusing me.
My goal: To add a ComboBox to an oTable.
What I tried: I decided to do the 'separation of concerns', in order to investigate it better, so I 'extracted' the ComboBox code from the table and am testing it on its own like this:
var cbWizardTypes = [
{
Code: "0",
Name: "Name0",
AdditionalText: "Additional0"
},
{
Code: "1",
Name: "Name1",
AdditionalText: "Additional1"
},
{
Code: "2",
Name: "Name2",
AdditionalText: "Additional2"
},
];
// now the template to use when showing the items
var cbWizardTypesTemplate = new sap.ui.core.ListItem({
key: "{Code}",
text: "{Name}",
additionalText: "{AdditionalText}"
});
// now let's create it and place it
var cbWizardType = new sap.m.ComboBox({
items: {
path: cbWizardTypes,
template: cbWizardTypesTemplate
},
showSecondaryValues: true
});
cbWizardType.placeAt(containerID, 'only');
Now, this is giving me this error in the console:
Additionally, I tried not to use a template, just to see what happens
var cbWizardType = new sap.m.ComboBox({
//items: {
// path: cbWizardTypes,
// template: cbWizardTypesTemplate
//},
items: cbWizardTypes,
showSecondaryValues: true
});
In this case, there are no errors in the Chrome Developer Tools - Console. I get a ComboBox with 3 items, but they are all blank.
Now, I will, at least, try to investigate further, although library-preload.js had been minified, so it will be really hard and time-consuming to navigate through all those 'd'-s, 'p'-s, 'j'-s, etc., I guess.
As always, I will appreciate any help. Thank you!
The problem lies with the binding path that you assign to the ComboBox. The binding should be a string & not an array. You will have to store the data in a model & bind it then to your control.
The code below should work
var cbWizardTypes = [
{
Code: "0",
Name: "Name0",
AdditionalText: "Additional0"
},
{
Code: "1",
Name: "Name1",
AdditionalText: "Additional1"
},
{
Code: "2",
Name: "Name2",
AdditionalText: "Additional2"
},
];
var oModel = new sap.ui.model.json.JSONModel({ items: cbWizardTypes});
// now the template to use when showing the items
var cbWizardTypesTemplate = new sap.ui.core.ListItem({
key: "{Code}",
text: "{Name}",
additionalText: "{AdditionalText}"
});
// now let's create it and place it
var cbWizardType = new sap.m.ComboBox({
items: {
path: "/items",
template: cbWizardTypesTemplate
},
showSecondaryValues: true
});
cbWizardType.setModel(oModel);
cbWizardType.placeAt(containerID, 'only');

Resources