Using dc.rasterLayer to draw lines


#21

Hi @Jason,

Please checkout the latest mapd-charting, it has the fix for the errors you were encountering during zoom in/out.

Happy Holidays!
Veda


#22

Hi @veda,

Thanks about the updating. And I am wondering how to set the opacity of the LINESTRING object. Cause I did not find any related example in the mapd-charting example folder.

Thanks and regards,
Jason


#23

Hi @veda,

I have encountered a problem when I try to cross-filtering between line strings and time chart. I am wondering if you know how to solve this. Here is the screenshot:
image

Here is the source code (just like your example in the github):

 var reduceMultiExpression2 = [
        {
            expression: "startTime",
            agg_mode:"min",
            name: "minimum"
        },
        {
          expression: "startTime",
          agg_mode:"max",
          name: "maximum"
        }
    ]


    crossFilter
        .groupAll()
        .reduceMulti(reduceMultiExpression2)
        .valuesAsync(true).then(function(timeChartBounds)

        var timeChartDimension = crossFilter.dimension("startTime");

        var timeChartGroup = timeChartDimension.group().reduceCount('*')

        var dcTimeChart = dc.lineChart('.chart-region')
            .width(350)
            .height(240)
            .elasticY(true)
            .renderHorizontalGridLines(true)
            .brushOn(true)
            .xAxisLabel('Time')
            .yAxisLabel('Number')
            .dimension(timeChartDimension)
            .group(timeChartGroup)
            .binParams({
                numBins: 288,
                binBounds: [timeChartBounds.minimum,timeChartBounds.maximum]
            });

        /* Set the x and y axis formatting with standard d3 functions */

        dcTimeChart
            .x(d3.time.scale.utc().domain([timeChartBounds.minimum,timeChartBounds.maximum]))
            .yAxis().ticks(5);

        dcTimeChart
            .xAxis()
            .scale(dcTimeChart.x())
            .tickFormat(dc.utils.customTimeFormat)
            .orient('top');

And in my database, this is the data type of “startTime” column: TIMESTAMP (0) NOT NULL ENCODING FIXED(32)
The value in “startTime” is like: 2015-09-23 06:45:32

Best,
Jason


#24

Hi @Jason,

Have you referred to example2.html which has an example of using time chart with point map, and the cross-filtering works as you brush along the time chart. You can replace the point map with the linemap example keeping the time chart as is.

Regards,
Veda


#25

Hi @veda,

Actually the code I pasted in the above reply is the same as the code in example2.html. It seems that the time value is wrong according to the error message, so I am wondering if the value I provided is the same as yours in your example. Otherwise, the error message is no reason to appear.

Best,
Jason


#26

Hi @Jason,

The fragment of code for the time chart looks correct. I have an application where I am also using the time chart and it is working correctly while cross filtering with other charts like pointmap, bar chart etc.

My time chart is based on the reported_date field which is defined as TIMESTAMP(0) in the table DDL.
The value for reported_date looks like this in the CSV file: 2018-04-12 04:00:00-05.

Regards,
Veda


#27

Hi @veda

Yep, it is working correctly when cross filtering with charts like point map, bar chart etc. But have you tried to cross filtering with the line string map? Maybe something’s wrong. I’m just saying it’s possible.

BTW, as for your value 2018-04-12 04:00:00-05. I am wondering what is the meaning of “-05”. Does it mean time zone? So the reason for the error message was that the time value I used did not have the time zone information?

Best,
Jason


#28

Hi @Jason
Yes, its the time zone, and also the date field is defined as TIMESTAMP(0).
I am working on a dataset with line stings and will be able to try the linemap instead of the point map to see if it cross filters correctly with the time chart. It will take me a day or so to get back to you.

Regards,
Veda


#29

Hi @Jason
I created a dashboard with a Linemap & Time chart, and I can confirm that cross filtering works as I brush across the time chart. You can check my code at https://github.com/omveda/forum_related/blob/master/exampleLinemap_timechart.js

NOTE:
Table Name = vs_vehicle_test
The Linemap is created using dimension = transmissionLine of type LINESTRING
Measure for color = OBUid of type SMALLINT
Measure for size = Speed of type FLOAT

The Time Chart is created with the dimension timeTransmission of type TIMESTAMP(0) along the x-axis with the #records on the y-axis.

Regards,
Veda