Skip to main content
fumrigar1-Visitor
1-Visitor
October 16, 2017
Question

Creating Map Mashup with 100 points

  • October 16, 2017
  • 14 replies
  • 5641 views

Hello,

I am trying to create a openmap mashup that shows multiple points (100) on it with specific information as you click on each point. I am new to the Thingworx software but I was able to plot many different things using bar graphs and now I am having trouble mapping coordinates. I take the steps below to upload a csv file using parsley and create a mashup but when it comes to mapping the separate points the map is blank (see attachments).

  1. Create a CSV with the correct Longitude and Latitude formatting. I used the Location formatting that is specified on the PTC website (http://support.ptc.com/cs/help/thingworx_hc/thingworx_7.0_hc/index.jspx?id=ThingProperties&action=show). On this site it shows the Location format should be Location = [longitude, latitude]. While on the Mashup it puts the location formatting as Location = [latitude, longitude] I tried uploading the data both ways and also with and without brackets.
    Screen Shot 2017-10-16 at 2.30.52 PM.png
  2. I upload the CSV using Parsley and the data is shown is services.
  3. Then I Execute the program in service to check if the data transferred over as needed. As shown in the screenshot attached.
    Thingworx Services.png
  4. I save the information and the data shape. Create a visual mashup click and drag the open maps template over and transfer all data into the graph.
  5. In the Locations field I put LatLong and leave everything else alone and click view mashup.
    Thingworx Map Mashup Information.png
  6. Doing so creates a blank map with only one dot that is on london.
    Screen Shot 2017-10-16 at 2.15.22 PM.png


Please let me know if you need more information.

14 replies

Rick-Stanley5-Regular Member
5-Regular Member
October 16, 2017

You need the LatLong column to be of type Location. The Location type takes three parameters: Latitude, Longitude, Elevation. Try removing the brackets and adding a 0.0 to the end of each value.

fumrigar1-VisitorAuthor
1-Visitor
October 16, 2017

Al,

Thank you for the quick response I changed my values in the CSV file as you recommended, it didn't work. I changed the value to 29.7,78.52,0.0 and reuploaded the file. I was reading online and i wonder if this has to do with js snippet I used. Below is the snippet, is this in the right format to read the data?

Screen Shot 2017-10-16 at 4.29.01 PM.png

Do I need to split up the two columns into longitude and latitude? or should I leave it combined?

qngo1-Visitor
1-Visitor
October 17, 2017

Hi, the "LatLong" must be of type LOCATION. You need to convert the data parsed in that type. For example:

var location = new Object();

location.latitude = Latitude;

location.longitude = Longitude;

location.elevation = 0;

location.units = "WGS84";

Than something like:

data.LatLong = location;

fumrigar1-VisitorAuthor
1-Visitor
October 17, 2017

Hello,

I apologize I have little to no experience with javascript. As I understand from the above suggestion I need convert the parsed data to a location type. Is there anyway someone can write the js code or show me a working example? Currently in my Services I have the below code what should I add to the code so that it reads the excel column above with the latitude and longitude?

var params = {

path: "/CSV_January_UP.csv" /* STRING */,

hasHeader: true /* BOOLEAN */,

//dateFormat: undefined /* STRING */,

fileRepository: me.name /* THINGNAME */,

//latitudeField: undefined /* NUMBER */,

fieldDelimiter: "," /* STRING */,

stringDelimiter: '"' /* STRING */,

//dataShape: undefined /* DATASHAPENAME */

};

// result: INFOTABLE

var result = Resources["Parsley"].ParseCSV(params);

Do I add the suggested code here? Also what do I add where it says (data).

rnayak-25-Regular Member
5-Regular Member
October 17, 2017

In step 3 you are getting an infotable that has the location info from your CSV file. So you just need to modify this infotable to add a column with a base type of "LOCATION" and then pass the latitude longitude information to create data. So in your excel store latitude and longitude in 2 separate columns for easy access during conversion process. Try to follow below steps,

1. Lets say you call the infotable from ParseCSV service as location table

     var locationTable= Resources["Parsley"].ParseCSV(params);

2. Modify this table to add a column called location

var newField = new Object();

        newField.name = "location";

        newField.baseType = 'LOCATION';

        locationTable.AddField(newField);

3. Now loop through the table to read the longitude and latitude columns and convert them into location field

     for (var i=0;i<locationTable.rows.length;i++){

     var row=locationTable.rows

     var templocation = new Object();

     templocation.latitude = row.Latitude;  //this is the coulmn where latitude got loaded from CSV

     templocation.longitude = row.Longitude; //this is the coulmn where longitude got loaded from CSV

     templocation.elevation = 0;

     templocation.units = "WGS84";

locationTable.rows.location =templocation

}

var result = locationTable

now the result table should have the new column with Location data type that will display on the map. I have not tested this code but some modification may be required if you run into syntax issues !! Hopefully it works on the 1st run

Terms & ConditionsAccessibility statement