问:
Stacked bar chart with real values in y-axis using ggplot in r
I have tried stacked bar chart and wanted to get the real values, instead of placing bars one over the other. for example if Ac energy consumption is 193 at empty load and 175 in non ac energy consumption at empty load, then i desired to have a plot that shows the same values instead of piling one over the other where the y axis values goes to around 350. i dont want this type of graph:

The sample data is here:

```<code>a<-tribble(
~"para",       ~"energy", ~"type",

  "Empty_Load",    175, "NoAC",
 "Half_Load"  ,   184, "NoAC",
 "Full_Load"   ,  191, "NoAC",
 "Empty_Load"   , 193, "AC",
 "Half_Load"     ,206, "AC",
 "Full_Load"     ,211, "AC"
)
</code>```

and this is what i tried :

```<code>ggplot(a,aes(x=para,y=energy))+
  geom_bar(stat="identity", aes(fill=type))
</code>```

答:
This will do the trick:

```<code>ggplot(a,aes(x=para,y=energy))+
  geom_bar(stat="identity", aes(fill=type), position ="dodge") #add position = "dodge" to place bars next to each other
</code>```

Or like this if you want a stacked chart with the values in presented in the graph:

```<code>ggplot(a,aes(x=para,y=energy))+
  geom_bar(stat="identity", aes(fill=type)) + #add position = "dodge" to place bars next to each other
  geom_text(aes(label = energy), position = position_stack(vjust = 0.5))
</code>```

Body:
I have tried stacked bar chart and wanted to get the real values, instead of placing bars one over the other. for example if Ac energy consumption is 193 at empty load and 175 in non ac energy consumption at empty load, then i desired to have a plot that shows the same values instead of piling one over the other where the y axis values goes to around 350. i dont want this type of graph:

The sample data is here:

a<-tribble(
~"para",       ~"energy", ~"type",

  "Empty_Load",    175, "NoAC",
 "Half_Load"  ,   184, "NoAC",
 "Full_Load"   ,  191, "NoAC",
 "Empty_Load"   , 193, "AC",
 "Half_Load"     ,206, "AC",
 "Full_Load"     ,211, "AC"
)

and this is what i tried :

ggplot(a,aes(x=para,y=energy))+
  geom_bar(stat="identity", aes(fill=type))

Body:
This will do the trick:

ggplot(a,aes(x=para,y=energy))+
  geom_bar(stat="identity", aes(fill=type), position ="dodge") #add position = "dodge" to place bars next to each other

Or like this if you want a stacked chart with the values in presented in the graph:

ggplot(a,aes(x=para,y=energy))+
  geom_bar(stat="identity", aes(fill=type)) + #add position = "dodge" to place bars next to each other
  geom_text(aes(label = energy), position = position_stack(vjust = 0.5))


来源: stackexchange

问:
CreateWICTextureFromFile returns E_NOINTERFACE
I want to create a Texture loader.
However, when I create the following line:

```<code>HRESULT res = CreateWICTextureFromFile(device, file.c_str(),&resource,&shaderResourceView,0);
</code>```

it returns E_NOINTERFACE.
The file I want to load definitively exists and both the ID3D11Device and the ID3D11DeviceContext are created successfully.

Here is my class declaration:

```<code>    using std::wstring;
    using Microsoft::WRL::ComPtr;
    using DirectX::CreateWICTextureFromFile;
    class Texture2DHandle {
    private:
        ComPtr<ID3D11Texture2D> texture;
        ComPtr<ID3D11ShaderResourceView> shaderResourceView;
    public:
        Texture2DHandle() = default;
        Texture2DHandle(void* data, int w, int h, DXGI_FORMAT format, ID3D11Device* device);
        Texture2DHandle(wstring file, ID3D11Device* device, ID3D11DeviceContext* context);

        ID3D11Texture2D* tex() const;
        ID3D11ShaderResourceView* srv() const;
    };
</code>```

And here is the definition of the constructor:

```<code>Texture2DHandle::Texture2DHandle(wstring file, ID3D11Device* device,ID3D11DeviceContext* context)
{
    ComPtr<ID3D11Resource> resource;
    HRESULT res = CreateWICTextureFromFile(device, file.c_str(),&resource,&shaderResourceView,0);
    if (FAILED(res))
        throw std::exception("Could not load texture from file!");
    res = resource.As<ID3D11Texture2D>(&texture);
    if (FAILED(res))
        throw std::exception("Could not load texture from file!");
}
</code>```

I dont have any clue what is meant with E_NOINTERFACE since both Device and DeviceContext exist

答:
Make sure you have initialized COM as that's the most likely problem.

```<code>#if (_WIN32_WINNT >= 0x0A00 /*_WIN32_WINNT_WIN10*/)
    Microsoft::WRL::Wrappers::RoInitializeWrapper initialize(RO_INIT_MULTITHREADED);
    if (FAILED(initialize))
        // error
#else
    HRESULT hr = CoInitializeEx(nullptr, COINIT_MULTITHREADED);
    if (FAILED(hr))
        // error
#endif
</code>```

See WICTextureLoader for detailed docs.

ContentLicense: CC BY-SA 4.0

Body:
I want to create a Texture loader.
However, when I create the following line:

HRESULT res = CreateWICTextureFromFile(device, file.c_str(),&resource,&shaderResourceView,0);

it returns E_NOINTERFACE.
The file I want to load definitively exists and both the ID3D11Device and the ID3D11DeviceContext are created successfully.

Here is my class declaration:

    using std::wstring;
    using Microsoft::WRL::ComPtr;
    using DirectX::CreateWICTextureFromFile;
    class Texture2DHandle {
    private:
        ComPtr<ID3D11Texture2D> texture;
        ComPtr<ID3D11ShaderResourceView> shaderResourceView;
    public:
        Texture2DHandle() = default;
        Texture2DHandle(void* data, int w, int h, DXGI_FORMAT format, ID3D11Device* device);
        Texture2DHandle(wstring file, ID3D11Device* device, ID3D11DeviceContext* context);

        ID3D11Texture2D* tex() const;
        ID3D11ShaderResourceView* srv() const;
    };

And here is the definition of the constructor:

Texture2DHandle::Texture2DHandle(wstring file, ID3D11Device* device,ID3D11DeviceContext* context)
{
    ComPtr<ID3D11Resource> resource;
    HRESULT res = CreateWICTextureFromFile(device, file.c_str(),&resource,&shaderResourceView,0);
    if (FAILED(res))
        throw std::exception("Could not load texture from file!");
    res = resource.As<ID3D11Texture2D>(&texture);
    if (FAILED(res))
        throw std::exception("Could not load texture from file!");
}

I dont have any clue what is meant with E_NOINTERFACE since both Device and DeviceContext exist

Body:
Make sure you have initialized COM as that's the most likely problem.

#if (_WIN32_WINNT >= 0x0A00 /*_WIN32_WINNT_WIN10*/)
    Microsoft::WRL::Wrappers::RoInitializeWrapper initialize(RO_INIT_MULTITHREADED);
    if (FAILED(initialize))
        // error
#else
    HRESULT hr = CoInitializeEx(nullptr, COINIT_MULTITHREADED);
    if (FAILED(hr))
        // error
#endif

See WICTextureLoader for detailed docs.


问:
How to convert a datetime to date in R, WITHOUT rounding the day?
I'm using R and trying to convert a datetime field into just the date? R gives me the desired format but keeps rounding up some of the day values. Specifically everything after 12 noon! I could not find any threads that address this exact problem. I actually figured out a solution but wanted to post the question because I spent a whole week troubleshooting.

```<code>#Convert the datetime field from character to a datetime
main_df$datetime <- strptime(main_df$ï..Date, format = "%m/%d/%Y %H:%M")
main_df$datetime <- as.POSIXct(main_df$datetime, tz = Sys.timezone())
head(main_df$datetime)
class(main_df$datetime)

#Remove the poorly computer-titled character field that contained datetime info
main_df <- subset(main_df, select = -c(ï..Date))

#Use the NEW datetime field to create a date field
#main_df$Date <- trunc(main_df$datetime,"days")
main_df$Date <- as.Date(main_df$datetime, format = "%m/%d/%Y")
?as.Date()
class(main_df$Date)

head(main_df$Date)
</code>```

That returned:

```<code>head(main_df$datetime)
[1] "2020-05-16 00:31:00 CDT" "2020-05-16 00:30:00 CDT" "2020-05-15 23:33:00 CDT" "2020-05-15 15:33:00 CDT"
[5] "2020-05-15 22:31:00 CDT" "2020-05-15 22:12:00 CDT"
</code>```

and

```<code>> class(main_df$Date)
[1] "Date"
>
> head(main_df$Date)
[1] "2020-05-16" "2020-05-16" "2020-05-16" "2020-05-15" "2020-05-16" "2020-05-16"
</code>```

Notice how the last 4 values for 'Date' should be 2020-05-15 but instead, they are converted to be 2020-05-16. So what are some other ways to fix this? I'm going to post one way that worked but I doubt it's the cleanest.

答:
Do your input dates include a timezone specification?  If not, they are ambiguous and the rounding may be right or it may be wrong.  If they do include a timezone specification, the lubridate package should handle them correctly.

I would advise against using tz = Sys.timezone() because that would make the interaction between input data and algorithm dependent on geography if your inputs don't include a timezone specification, so what works for you might not work for a different user in a different location.

Body:
I'm using R and trying to convert a datetime field into just the date? R gives me the desired format but keeps rounding up some of the day values. Specifically everything after 12 noon! I could not find any threads that address this exact problem. I actually figured out a solution but wanted to post the question because I spent a whole week troubleshooting.

#Convert the datetime field from character to a datetime
main_df$datetime <- strptime(main_df$ï..Date, format = "%m/%d/%Y %H:%M")
main_df$datetime <- as.POSIXct(main_df$datetime, tz = Sys.timezone())
head(main_df$datetime)
class(main_df$datetime)

#Remove the poorly computer-titled character field that contained datetime info
main_df <- subset(main_df, select = -c(ï..Date))

#Use the NEW datetime field to create a date field
#main_df$Date <- trunc(main_df$datetime,"days")
main_df$Date <- as.Date(main_df$datetime, format = "%m/%d/%Y")
?as.Date()
class(main_df$Date)

head(main_df$Date)

That returned:

head(main_df$datetime)
[1] "2020-05-16 00:31:00 CDT" "2020-05-16 00:30:00 CDT" "2020-05-15 23:33:00 CDT" "2020-05-15 15:33:00 CDT"
[5] "2020-05-15 22:31:00 CDT" "2020-05-15 22:12:00 CDT"

and

> class(main_df$Date)
[1] "Date"
>
> head(main_df$Date)
[1] "2020-05-16" "2020-05-16" "2020-05-16" "2020-05-15" "2020-05-16" "2020-05-16"

Notice how the last 4 values for 'Date' should be 2020-05-15 but instead, they are converted to be 2020-05-16. So what are some other ways to fix this? I'm going to post one way that worked but I doubt it's the cleanest.


问:
How to point from domain to the target
I would like to use cloudflare to use DNS management instead of Route53.

I added source code and set up EC2 and Loadbalancer, but I don't know which ipaddress or DNS name(A record) should be a target.

I set up with DNS name from loadbalancer, and it works now.

However, when I go to the public IP address from Instance, it works as well.

Which one do I need to set up with between Public DNS (IPv4) from Instances tab or DNS name (A record) from loadbalancers tabs

Thank you in advance.

答:
If you have a load balancer in front of your instance(s) then use the CNAME of the load balancer.

You should update your instances security group to only allow http/https from the load balancer. Additionally if you're able to recreate the instance put it into a private subnet.

Title: How to point from domain to the target


问:
Laravel 5.4 redirection to custom url after login
I am using Laravel Framework 5.4.10, and I am using the regular authentication that

```<code>php artisan make:auth
</code>```

provides. I want to protect the entire app, and to redirect users to /themes after login.

I have 4 controllers: ForgotPasswordController.php, LoginController.php, RegisterController.php and ResetPasswordController.php. I have edited this line into the last three:

```<code>protected $redirectTo = '/themes';
</code>```

This is the first line in my routes/web.php:

```<code>Auth::routes();
</code>```

I have added this function in my Controller.php:

```<code>    public function __construct()
    {
        $this->middleware('auth');

    }
</code>```

I have edited app/Http/Middleware/RedirectIfAuthenticated.php, so that the handle function looks like this:

```<code>public function handle($request, Closure $next, $guard = null)
{
    if (Auth::guard($guard)->check()) {
        return redirect('/themes');
    }

    return $next($request);
}
</code>```

It's all fine, except when I click the Login button, I get redirected to "/", not "/themes". If I don't require authentication in the controllers (no __contruct function in Controller.php file), I get redirected OK at login. What am I doing wrong?

答:
Path Customization (tested in laravel 7)
When a user is successfully authenticated, they will be redirected to the /home URI. You can customize the post-authentication redirect path using the HOME constant defined in your RouteServiceProvider:

```<code>public const HOME = '/home';
</code>```

ContentLicense: CC BY-SA 3.0

Body:
I am using Laravel Framework 5.4.10, and I am using the regular authentication that

php artisan make:auth

provides. I want to protect the entire app, and to redirect users to /themes after login.

I have 4 controllers: ForgotPasswordController.php, LoginController.php, RegisterController.php and ResetPasswordController.php. I have edited this line into the last three:

protected $redirectTo = '/themes';

This is the first line in my routes/web.php:

Auth::routes();

I have added this function in my Controller.php:

    public function __construct()
    {
        $this->middleware('auth');

    }

I have edited app/Http/Middleware/RedirectIfAuthenticated.php, so that the handle function looks like this:

public function handle($request, Closure $next, $guard = null)
{
    if (Auth::guard($guard)->check()) {
        return redirect('/themes');
    }

    return $next($request);
}

It's all fine, except when I click the Login button, I get redirected to "/", not "/themes". If I don't require authentication in the controllers (no __contruct function in Controller.php file), I get redirected OK at login. What am I doing wrong?

Body:
Path Customization (tested in laravel 7)
When a user is successfully authenticated, they will be redirected to the /home URI. You can customize the post-authentication redirect path using the HOME constant defined in your RouteServiceProvider:

public const HOME = '/home';


问:
SweetAlert prompt with two input fields
Currently working on a personal project. I want the user to click a button and a SweetAlert prompt would be presented for the user to verify their credential. However, the code I see on the SweetAlert website only allows one input field. Here is the code I have:

```<code>swal({
  title: "Authenicating for continuation",
  text: "Test",
  type: "input",
  showCancelButton: true,
  closeOnConfirm: false,
  animation: "slide-from-top",
  inputPlaceholder: "Write something"
}, function(inputValue) {
  if (inputValue === false) return false;
  if (inputValue === "") {
    swal.showInputError("You need to write something!");
    return false
  }
  // swal("Nice!", "You wrote: " + inputValue, "success");
});
</code>```

So, is there a way I can get two input fields? One input field for the password and the other input field for text.

答:
On SweetAlert 2.x you can use this vanilla Javascript for getting / setting one input. Yo can chain more elements to content so you can have multiple inputs:</p>

```<code>  var slider = document.createElement("input");
      slider.type = "number";
      slider.value = 5;
      slider.step=1;
      slider.min = 5;
      slider.max = 50;

      this.swal({
        title: 'Request time to XXX',
        text: 'Select values',
        content: slider,
        buttons: {
          cancel: "Run away!",
          catch: {
            text: "Throw Pokéball",
            value: slider.value,
          },
          defeat: true,
        }
      }).then((value) => {
        console.log(slider.value); // Here you receive the input data value
        //swal(`You typed: ${value}`);
      });
</code>```

Title: SweetAlert prompt with two input fields

Body:
Currently working on a personal project. I want the user to click a button and a SweetAlert prompt would be presented for the user to verify their credential. However, the code I see on the SweetAlert website only allows one input field. Here is the code I have:

swal({
  title: "Authenicating for continuation",
  text: "Test",
  type: "input",
  showCancelButton: true,
  closeOnConfirm: false,
  animation: "slide-from-top",
  inputPlaceholder: "Write something"
}, function(inputValue) {
  if (inputValue === false) return false;
  if (inputValue === "") {
    swal.showInputError("You need to write something!");
    return false
  }
  // swal("Nice!", "You wrote: " + inputValue, "success");
});

So, is there a way I can get two input fields? One input field for the password and the other input field for text.

Body:
On SweetAlert 2.x you can use this vanilla Javascript for getting / setting one input. Yo can chain more elements to content so you can have multiple inputs:

  var slider = document.createElement("input");
      slider.type = "number";
      slider.value = 5;
      slider.step=1;
      slider.min = 5;
      slider.max = 50;

      this.swal({
        title: 'Request time to XXX',
        text: 'Select values',
        content: slider,
        buttons: {
          cancel: "Run away!",
          catch: {
            text: "Throw Pokéball",
            value: slider.value,
          },
          defeat: true,
        }
      }).then((value) => {
        console.log(slider.value); // Here you receive the input data value
        //swal(`You typed: ${value}`);
      });


问:
How to get only date (DD-MM-YYYY) format not time with date using moment.js?
I am using moment.js for formatting dates:

```<code>const dateFormat = 'DD/MM/YYYY';
setValue('startDate', moment(booking.startDate, dateFormat));
</code>```

I want the date to be 01-06-2020 instead of 2020-06-01T07:33:04.392Z. Any idea, because I don't know how to do this?

答:
This is literally explained in the Momentjs frontpage https://momentjs.com/.
First you add your datetime to moment, then call the format function. Like this.

```<code> moment('2020-06-01T07:33:04.392Z').format('DD-MM-YYYY')
</code>```

This returns "01-06-2020"

Body:
I am using moment.js for formatting dates:

const dateFormat = 'DD/MM/YYYY';
setValue('startDate', moment(booking.startDate, dateFormat));

I want the date to be 01-06-2020 instead of 2020-06-01T07:33:04.392Z. Any idea, because I don't know how to do this?

Body:
This is literally explained in the Momentjs frontpage https://momentjs.com/.
First you add your datetime to moment, then call the format function. Like this.

 moment('2020-06-01T07:33:04.392Z').format('DD-MM-YYYY')

This returns "01-06-2020"


问:
python, struggling to plot CSV file
as the title explains I'm trying to read in a CSV file and plot it, the file is in the following format:

```<code>Dishwasher,60,1,1,1,0,0,1

Washing Machine,200,0,0,0,0,1,1
</code>```

where I just want to plot the 6 digits at the end.

Here is my code so far:

```<code>import matplotlib.pyplot as plt
import numpy as np
import csv
y1=[]
y2=[]

x = np.array([1,2,3,4,5,6])
with open('File.csv', 'r') as csvfile:
    plots = csv.reader(csvfile, delimiter=',')
    rows = [row for row in plots]
y1=int((rows[0])-2)
y2=int((rows[1])-2)

plt.plot(x,y1, label='Washing Machine')
plt.plot(x,y2, label='Dishwasher')
plt.show()
</code>```

I've been trying to solve the problem for hours now but everything I do brings about a new error.

In this code, the error is:

TypeError: unsupported operand type(s) for -: 'list' and 'int'

Which from my understanding means it's trying to convert a list into an integer which isn't possible? Thanks for any and all help

答: It looks like rows is array of arrays. Rows[0] is array and you trying to do rows[0] - 2</p>

Title: python, struggling to plot CSV file

Body:
as the title explains I'm trying to read in a CSV file and plot it, the file is in the following format:

Dishwasher,60,1,1,1,0,0,1

Washing Machine,200,0,0,0,0,1,1

where I just want to plot the 6 digits at the end.

Here is my code so far:

import matplotlib.pyplot as plt
import numpy as np
import csv
y1=[]
y2=[]

x = np.array([1,2,3,4,5,6])
with open('File.csv', 'r') as csvfile:
    plots = csv.reader(csvfile, delimiter=',')
    rows = [row for row in plots]
y1=int((rows[0])-2)
y2=int((rows[1])-2)

plt.plot(x,y1, label='Washing Machine')
plt.plot(x,y2, label='Dishwasher')
plt.show()

I've been trying to solve the problem for hours now but everything I do brings about a new error.

In this code, the error is:

TypeError: unsupported operand type(s) for -: 'list' and 'int'

Which from my understanding means it's trying to convert a list into an integer which isn't possible? Thanks for any and all help


问:
Move from python 2 to python 3 on Mac
I have both python 2.7.16 and python 3.7.3 on my Macbook air.

I don't use python 2.7.16 so I want to remove it, but I understood that this could break my Mac.

I am frustrated from using python3 and pip3 instead of python and pip is there a way to make all of the python3 commands to be accessed by using python (without 3) instead of python 2 and make python 2 be accessible by using python2?

tnx ahead

答:
```<code>(base) shrub$ /usr/bin/py
pydoc             python            python2.7         pythonw
pydoc2.7          python-config     python2.7-config  pythonw2.7
</code>```

Looking in /usr/bin there is a python executable (which when run opens a shell with python3) and a python2.7 executable (which when run opens a shell with python2).

```<code>(base) shrub$ python
Python 3.7.4 (default, Aug 13 2019, 15:17:50)
[Clang 4.0.1 (tags/RELEASE_401/final)] :: Anaconda, Inc. on darwin
Type "help", "copyright", "credits" or "license" for more information.

(base) shrub$ python2.7
Python 2.7.10 (default, Feb 22 2019, 21:55:15)
[GCC 4.2.1 Compatible Apple LLVM 10.0.1 (clang-1001.0.37.14)] on darwin
Type "help", "copyright", "credits" or "license" for more information.
</code>```

Running python scripts with python (python hello.py for example) should default to python3 and running scripts with python2.7 (python2.7 hello.py for example) will run them with python2.

Also there is a script called 2to3 which can help you with converting your python2 code to python3 :)
https://docs.python.org/3.0/library/2to3.html

Title: Move from python 2 to python 3 on Mac

Body:
(base) shrub$ /usr/bin/py
pydoc             python            python2.7         pythonw
pydoc2.7          python-config     python2.7-config  pythonw2.7

Looking in /usr/bin there is a python executable (which when run opens a shell with python3) and a python2.7 executable (which when run opens a shell with python2).

(base) shrub$ python
Python 3.7.4 (default, Aug 13 2019, 15:17:50)
[Clang 4.0.1 (tags/RELEASE_401/final)] :: Anaconda, Inc. on darwin
Type "help", "copyright", "credits" or "license" for more information.

(base) shrub$ python2.7
Python 2.7.10 (default, Feb 22 2019, 21:55:15)
[GCC 4.2.1 Compatible Apple LLVM 10.0.1 (clang-1001.0.37.14)] on darwin
Type "help", "copyright", "credits" or "license" for more information.

Running python scripts with python (python hello.py for example) should default to python3 and running scripts with python2.7 (python2.7 hello.py for example) will run them with python2.

Also there is a script called 2to3 which can help you with converting your python2 code to python3 :)
https://docs.python.org/3.0/library/2to3.html


问:
Draw a chart line in Android
What would be a simple example of drawing a plot in Android with a CHART LINE using a JAR file (and the JAR file itself)?

I want to draw a CHART LINE, not chart pie nor chart bar, and I want to do this by importing a JAR file into my application.

I have found some examples of JAR file on the Internet, but these don't have example of usage, or are way too complicated.

I just want a simple plot, and it doesn't have too be that nice (neither ugly;)))

The JAR file must be free!

EDIT:

Something like http://writerbay.net/?p=401, but not this one :D I can't use it - I have my reasons!

答:
Look in Any good graphing packages for Android? for lots of charting packages with links to each one. Each one of the links has examples of how to use it. I've used AChartEngine, and it was easy enough.

See svn/trunk/achartengine/demo/org/achartengine/chartdemo/demo/chart/AverageTemperatureChart.jav for a simple example of a line chart  - this example has 4 lines, but you could do one or whatever.

Title: Draw a chart line in Android


问:
input texbox value not working in textbox javascript
I would like to know how to allow max value based on min entered in textbox and should allow only numbers and no special characters and alphabets,

I have two text box, min and max,
min can allow only numbers both positive and negative but no special characters and alphabets

max value should be greater than min value and not allow special characters and alphabets

Here is my code, max not working proper.

```<code>class Sample extends React.Component {
 constructor(props) {
    super(props);
    this.state = {
      min: "",
      max: ""
    }
 }
hanldeMin = (e) => {
    if (e.target.value !== "") {
      this.setState({
        min: e.target.value
      })
    }
  }

 handleMax = (e) => {
    if (e.target.value !== "") {
      if (parseInt(e.target.value) < parseInt(this.state.min)) {
        e.target.value = "";
      }
      this.setState({
        max: e.target.value
      })
    }
  }
render(){
return (
 <React.Fragment>
   <div className="row">

       <div className="col-lg-5 col-sm-5 noPadding noMargin">
                <input
                  type="text"
                  placeholder="min"
                  className="form-control"
                  id="minavlitems"
                  value={this.state.min}
                  onChange={(event) => {
                    if (isNaN(Number(event.target.value))) {
                      return;
                    } else {
                      this.hanldeMin(event);
                    }
                  }}
                />
              </div>
              <div className="col-lg-1 col-sm-1 alignCenter noPadding noMargin">
                <b>-</b>
              </div>
              <div className="col-lg-6 col-sm-6 noPadding noMargin">
                <input
                  type="text"
                  min={this.state.min}
                  className="form-control"
                  placeholder="max"
                  id="maxavlitems"
                  value={this.state.max}
                  onChange={(event) => {
                    if (isNaN(Number(event.target.value))) {
                      return;
                    } else {
                       this.hanldeMax(event);
                    }
                  }}
                />
              </div>
             </div>
   </div>
 </React.Fragment>

)

}

}

</code>```

答:
You are setting the state even your max input is less than min in state.

Change your if condition as follows

```<code>handleMax = (e) => {
    if (e.target.value !== "") {
      if (parseInt(e.target.value) > parseInt(this.state.min))
         this.setState({
           max: e.target.value
         })
     }
  }
</code>```

Body:
I would like to know how to allow max value based on min entered in textbox and should allow only numbers and no special characters and alphabets,

I have two text box, min and max,
min can allow only numbers both positive and negative but no special characters and alphabets

max value should be greater than min value and not allow special characters and alphabets

Here is my code, max not working proper.

class Sample extends React.Component {
 constructor(props) {
    super(props);
    this.state = {
      min: "",
      max: ""
    }
 }
hanldeMin = (e) => {
    if (e.target.value !== "") {
      this.setState({
        min: e.target.value
      })
    }
  }

 handleMax = (e) => {
    if (e.target.value !== "") {
      if (parseInt(e.target.value) < parseInt(this.state.min)) {
        e.target.value = "";
      }
      this.setState({
        max: e.target.value
      })
    }
  }
render(){
return (
 <React.Fragment>

                <input
                  type="text"
                  placeholder="min"
                  className="form-control"
                  id="minavlitems"
                  value={this.state.min}
                  onChange={(event) => {
                    if (isNaN(Number(event.target.value))) {
                      return;
                    } else {
                      this.hanldeMin(event);
                    }
                  }}
                />

                -

                <input
                  type="text"
                  min={this.state.min}
                  className="form-control"
                  placeholder="max"
                  id="maxavlitems"
                  value={this.state.max}
                  onChange={(event) => {
                    if (isNaN(Number(event.target.value))) {
                      return;
                    } else {
                       this.hanldeMax(event);
                    }
                  }}
                />

 </React.Fragment>

)

}

}

Body:
You are setting the state even your max input is less than min in state.

Change your if condition as follows

handleMax = (e) => {
    if (e.target.value !== "") {
      if (parseInt(e.target.value) > parseInt(this.state.min))
         this.setState({
           max: e.target.value
         })
     }
  }


问:
SQL: get the latest record in each day of each user
I have a table that looks like

```<code>user_id behavior time
A B1 2020-05-30 09:07:21
A B1 2020-05-31 12:38:21
A B2 2020-05-31 14:39:23
B B1 2020-05-31 12:32:09
</code>```

I would like to get the latest records in each day of each user, so the above table will become

```<code>    user_id behavior time
    A B1 2020-05-30 09:07:21
    A B2 2020-05-31 14:39:23
    B B1 2020-05-31 12:32:09
</code>```

I look to some other questions in stackoverflow but did not find exactly what I am looking for.

Thanks for your help.

答:
Please use below query, you can use simple min() function,</p>

```<code>select user_id, behaviour, min(time) group by user_id, behaviour;
</code>```

Body:
I have a table that looks like

user_id behavior time
A B1 2020-05-30 09:07:21
A B1 2020-05-31 12:38:21
A B2 2020-05-31 14:39:23
B B1 2020-05-31 12:32:09

I would like to get the latest records in each day of each user, so the above table will become

    user_id behavior time
    A B1 2020-05-30 09:07:21
    A B2 2020-05-31 14:39:23
    B B1 2020-05-31 12:32:09

I look to some other questions in stackoverflow but did not find exactly what I am looking for.

Thanks for your help.

Body:
Please use below query, you can use simple min() function,

select user_id, behaviour, min(time) group by user_id, behaviour;


问:
Better way of writing a long and simple if statement?
I am writing some custom values for a variable.
Is there a better way of writing this?</p>

```<code>if val == 1:
    val = -20
elif val == 2:
    val = -15
elif val == 3:
    val = -10
elif val == 4:
    val = -5
elif val == 5:
    val = 0
elif val == 6:
    val = 4
elif val == 7:
    val = 8
elif val == 8:
    val = 12
elif val == 9:
    val = 16
elif val == 10:
    val = 20
</code>```

答:
Assuming I've got the correct pattern, the most general solution is:

```<code>def func(val):
    return abs(5-val)*min(max(val, -5, key=abs), 4)
</code>```

Output:

```<code>[func(i) for i in range(-5, 13)]
[..., -50, -45, -40, -35, -30, -25, -20, -15, -10, -5, 0, 4, 8, 12, 16, 20, 24, 28, ...]
</code>```

Body:
I am writing some custom values for a variable.
Is there a better way of writing this?

if val == 1:
    val = -20
elif val == 2:
    val = -15
elif val == 3:
    val = -10
elif val == 4:
    val = -5
elif val == 5:
    val = 0
elif val == 6:
    val = 4
elif val == 7:
    val = 8
elif val == 8:
    val = 12
elif val == 9:
    val = 16
elif val == 10:
    val = 20

Body:
Assuming I've got the correct pattern, the most general solution is:

def func(val):
    return abs(5-val)*min(max(val, -5, key=abs), 4)

Output:

[func(i) for i in range(-5, 13)]
[..., -50, -45, -40, -35, -30, -25, -20, -15, -10, -5, 0, 4, 8, 12, 16, 20, 24, 28, ...]


问:
java.io.IOException: Spill failed in MapReduce with Combiber
I'm using HADOOP mapReduce.
When running the project without local aggregation i.e. Combiner Class, it runs without problems.

When i add the combiner class i get this message:

```<code>java.lang.Exception: java.io.IOException: Spill failed
</code>```

In addition , the console points to these lines as the ones which causes the errors:

```<code>context.write(new DoubleGramKey(decade), occurrences);
</code>```

and:

```<code>word2.write(out);
</code>```

Below are the classes of the StepOne Class and DoubleGramKey Class:

public class DoubleGramKey implements WritableComparable<DoubleGramKey>{

    private Text word1;
    private Text word2;
    private IntWritable decade;

    public DoubleGramKey(Text word1, Text word2, IntWritable decade) {
        this.word1 = word1;
        this.word2 = word2;
        this.decade = decade;
    }

    public DoubleGramKey(IntWritable decade) {
        this(new Text("*"),new Text("*"),decade);
    }

    public DoubleGramKey() {
        this(new Text("*"),new Text("*"), new IntWritable(-1));
    }

    public void readFields(DataInput in) throws IOException {
        word1.readFields(in);
        word2.readFields(in);
        decade.readFields(in);
    }

    public void write(DataOutput out) throws IOException {
        word1.write(out);
        word2.write(out);
        decade.write(out);
    }

    public int compareTo(DoubleGramKey other) {
        // if this.decade == other.decade, put <decade * *> first
        // if this.w1 == other.w1, put <w1, *> before <w1,w2>
        int ret = this.decade.get() - other.decade.get();
        if (ret == 0) {
            if (this.word1.toString().equals("*") && !other.word1.toString().equals("*"))
                ret = -1;
            else if (other.word1.toString().equals("*") && !this.word1.toString().equals("*"))
                ret = 1;
            else
                ret = this.word1.toString().compareTo(other.word1.toString());
        }
        if (ret == 0) { //same decade and same w1
            if (this.word2.toString().equals("*") && !other.word2.toString().equals("*"))
                ret = -1;
            else if (other.word2.toString().equals("*") &&  !this.word2.toString().equals("*"))
                ret = 1;
            else
                ret = this.word2.toString().compareTo(other.word2.toString());
        }
        return ret;
    }

    public IntWritable getDecade() {
        return this.decade;
    }

    public Text getWord1() {
        return this.word1;
    }

    public Text getWord2() {
        return this.word2;
    }

    @Override
    public String toString() {
        return this.decade + " " + this.word1 + " " + this.word2;
    }
}
```

<pre class="lang-java prettyprint-override"><code>public class StepOne {

    private static class MyMapper extends Mapper<LongWritable, Text, DoubleGramKey, IntWritable> {

        public void map(LongWritable key, Text val, Context context) throws IOException, InterruptedException {
            String[] line = val.toString().split("\t");
            String[] words = line[0].split(" ");
            String decade_str = line[1].substring(0, line[1].length() - 1);
            decade_str = new StringBuilder().append(decade_str).append("0").toString(); //  the decade. for example 1990
            IntWritable decade = new IntWritable(Integer.parseInt(decade_str));
            IntWritable occurrences = new IntWritable(Integer.parseInt(line[2]));
            if (words.length == 1) {
                context.write(new DoubleGramKey(new Text(words[0]), new Text("*"), decade), occurrences);
                context.write(new DoubleGramKey(decade), occurrences); //<* * decade, occurs>
            } else if (words.length == 2) {
                context.write(new DoubleGramKey(new Text(words[0]), new Text(words[1]), decade), occurrences);
            }
            // this is how we will cound number of words per decade
            // example *^&decade_couneter 1990 , 20
        }
    }

    public class MyCombiner extends Reducer<DoubleGramKey, IntWritable, DoubleGramKey, IntWritable> {

        @Override
        public void reduce(DoubleGramKey key, Iterable<IntWritable> values, Context context)
                throws IOException, InterruptedException {
            int sum = 0;
            for (IntWritable value : values) {
                sum += value.get();
            }
            context.write(key, new IntWritable(sum));

        }
    }

    public static void main(String[] args) throws IOException, ClassNotFoundException, InterruptedException {
        System.out.println("starting EMR");

        Configuration configuration = new Configuration();
        Job job = Job.getInstance(configuration);
        job.setJarByClass(StepOne.class);
        job.setMapperClass(MyMapper.class);
        job.setMapOutputKeyClass(DoubleGramKey.class);
        job.setMapOutputValueClass(IntWritable.class);
        job.setReducerClass(MyReducer.class);
        job.setCombinerClass(MyCombiner.class);
        job.setNumReduceTasks(1);
        job.setOutputKeyClass(Text.class);
        job.setOutputValueClass(Text.class);
        job.setPartitionerClass(StepOne.MyPartitioner.class);

        job.setInputFormatClass(TextInputFormat.class);
        SequenceFileInputFormat.addInputPath(job, new Path("/home/maor/Desktop/DSP202/ass2_202/googlebooks-eng-all-1gram-20120701-z"));
        SequenceFileInputFormat.addInputPath(job, new Path("/home/maor/Desktop/DSP202/ass2_202/googlebooks-eng-all-2gram-20120701-zy"));
        String output = "output";

        //TODO change the output for args[2] in aws run
        job.setOutputFormatClass(TextOutputFormat.class);
        FileOutputFormat.setOutputPath(job, new Path(output));
        job.waitForCompletion(true);
    }
}
</code>```

答: Well, the spilled problem was caused by noMethodException . , hence I discovered that my combiner class was missing the word "STATIC", which solved the problem.</p>

Body:
I'm using HADOOP mapReduce.
When running the project without local aggregation i.e. Combiner Class, it runs without problems.

When i add the combiner class i get this message:

java.lang.Exception: java.io.IOException: Spill failed

In addition , the console points to these lines as the ones which causes the errors:

context.write(new DoubleGramKey(decade), occurrences);

and:

word2.write(out);

Below are the classes of the StepOne Class and DoubleGramKey Class:

public class DoubleGramKey implements WritableComparable<DoubleGramKey>{

    private Text word1;
    private Text word2;
    private IntWritable decade;

    public DoubleGramKey(Text word1, Text word2, IntWritable decade) {
        this.word1 = word1;
        this.word2 = word2;
        this.decade = decade;
    }

    public DoubleGramKey(IntWritable decade) {
        this(new Text("*"),new Text("*"),decade);
    }

    public DoubleGramKey() {
        this(new Text("*"),new Text("*"), new IntWritable(-1));
    }

    public void readFields(DataInput in) throws IOException {
        word1.readFields(in);
        word2.readFields(in);
        decade.readFields(in);
    }

    public void write(DataOutput out) throws IOException {
        word1.write(out);
        word2.write(out);
        decade.write(out);
    }

    public int compareTo(DoubleGramKey other) {
        // if this.decade == other.decade, put <decade * *> first
        // if this.w1 == other.w1, put <w1, *> before <w1,w2>
        int ret = this.decade.get() - other.decade.get();
        if (ret == 0) {
            if (this.word1.toString().equals("*") && !other.word1.toString().equals("*"))
                ret = -1;
            else if (other.word1.toString().equals("*") && !this.word1.toString().equals("*"))
                ret = 1;
            else
                ret = this.word1.toString().compareTo(other.word1.toString());
        }
        if (ret == 0) { //same decade and same w1
            if (this.word2.toString().equals("*") && !other.word2.toString().equals("*"))
                ret = -1;
            else if (other.word2.toString().equals("*") &&  !this.word2.toString().equals("*"))
                ret = 1;
            else
                ret = this.word2.toString().compareTo(other.word2.toString());
        }
        return ret;
    }

    public IntWritable getDecade() {
        return this.decade;
    }

    public Text getWord1() {
        return this.word1;
    }

    public Text getWord2() {
        return this.word2;
    }

    @Override
    public String toString() {
        return this.decade + " " + this.word1 + " " + this.word2;
    }
}

public class StepOne {

    private static class MyMapper extends Mapper<LongWritable, Text, DoubleGramKey, IntWritable> {

        public void map(LongWritable key, Text val, Context context) throws IOException, InterruptedException {
            String[] line = val.toString().split("\t");
            String[] words = line[0].split(" ");
            String decade_str = line[1].substring(0, line[1].length() - 1);
            decade_str = new StringBuilder().append(decade_str).append("0").toString(); //  the decade. for example 1990
            IntWritable decade = new IntWritable(Integer.parseInt(decade_str));
            IntWritable occurrences = new IntWritable(Integer.parseInt(line[2]));
            if (words.length == 1) {
                context.write(new DoubleGramKey(new Text(words[0]), new Text("*"), decade), occurrences);
                context.write(new DoubleGramKey(decade), occurrences); //<* * decade, occurs>
            } else if (words.length == 2) {
                context.write(new DoubleGramKey(new Text(words[0]), new Text(words[1]), decade), occurrences);
            }
            // this is how we will cound number of words per decade
            // example *^&decade_couneter 1990 , 20
        }
    }

    public class MyCombiner extends Reducer<DoubleGramKey, IntWritable, DoubleGramKey, IntWritable> {

        @Override
        public void reduce(DoubleGramKey key, Iterable<IntWritable> values, Context context)
                throws IOException, InterruptedException {
            int sum = 0;
            for (IntWritable value : values) {
                sum += value.get();
            }
            context.write(key, new IntWritable(sum));

        }
    }

    public static void main(String[] args) throws IOException, ClassNotFoundException, InterruptedException {
        System.out.println("starting EMR");

        Configuration configuration = new Configuration();
        Job job = Job.getInstance(configuration);
        job.setJarByClass(StepOne.class);
        job.setMapperClass(MyMapper.class);
        job.setMapOutputKeyClass(DoubleGramKey.class);
        job.setMapOutputValueClass(IntWritable.class);
        job.setReducerClass(MyReducer.class);
        job.setCombinerClass(MyCombiner.class);
        job.setNumReduceTasks(1);
        job.setOutputKeyClass(Text.class);
        job.setOutputValueClass(Text.class);
        job.setPartitionerClass(StepOne.MyPartitioner.class);

        job.setInputFormatClass(TextInputFormat.class);
        SequenceFileInputFormat.addInputPath(job, new Path("/home/maor/Desktop/DSP202/ass2_202/googlebooks-eng-all-1gram-20120701-z"));
        SequenceFileInputFormat.addInputPath(job, new Path("/home/maor/Desktop/DSP202/ass2_202/googlebooks-eng-all-2gram-20120701-zy"));
        String output = "output";

        //TODO change the output for args[2] in aws run
        job.setOutputFormatClass(TextOutputFormat.class);
        FileOutputFormat.setOutputPath(job, new Path(output));
        job.waitForCompletion(true);
    }
}


答:
in those 2 lines:

```<code>y1=int((rows[0])-2)
y2=int((rows[1])-2)
</code>```

you are taking the first and second elements of the list subtracting 2 and transforming on an int the assigning it  to the variables y1 and y2
that means you cant subtract an int from a list

i recommend you to inspect your values before plotting it you can use the debugger or just print rows, y1 and y2 and you will have more insight on what is going on

the error tells you exactly what is going on:

```<code>TypeError: unsupported operand type(s) for -: 'list' and 'int'
</code>```

obs try this out:

```<code>y1=rows[0][2:]
y2=rows[1][2:]
</code>```

Title: python, struggling to plot CSV file

Body:
in those 2 lines:

y1=int((rows[0])-2)
y2=int((rows[1])-2)

you are taking the first and second elements of the list subtracting 2 and transforming on an int the assigning it  to the variables y1 and y2
that means you cant subtract an int from a list

i recommend you to inspect your values before plotting it you can use the debugger or just print rows, y1 and y2 and you will have more insight on what is going on

the error tells you exactly what is going on:

TypeError: unsupported operand type(s) for -: 'list' and 'int'

obs try this out:

y1=rows[0][2:]
y2=rows[1][2:]


问:
Most Efficient Way Of Clearing Cache Using ASP.NET
I am building an ASP.NET/Umbraco powered website which is very custom data driven via  entity framework, we are having to cache quite a lot of the data queries (For example searches by keyword) as it's a busy site.

But when a user creates a new data entry, I need to clear all the cached queries (Searches etc..) so the new entry is available in the results.

So in my create, delete and update methods I am calling the following method:

```<code>public static void ClearCacheItems()
{
    var enumerator = HttpContext.Current.Cache.GetEnumerator();

    while (enumerator.MoveNext())
    {
        HttpContext.Current.Cache.Remove(enumerator.Key.ToString());
    }
}
</code>```

Is this really bad? I can't see how else I am supposed to clear the cached items?

答:
It would have been very easy for the designers of the Cache class to add a Clear method to it. But they have not and it was by design - hence your code is bad.

One problem is threading implications of enumerating through a collection if the collection is modified. That would throw an error.

You really should never need to clear the whole of the cache. If server needs memory, it will clear it. Cache access is by key (for a reason) hence you need to know what you are trying to access. So if you need to remove and item, do it by a key.

UPDATE

My advice would be to design the cache in a way that clearing the cache would be very easy. For example group your cache items (create a class to hold related cache results) by an ID and use the ID as the key. Whenever something related to that ID is changed, clear the cache for that ID. Easy, peasy.

Body:
I am building an ASP.NET/Umbraco powered website which is very custom data driven via  entity framework, we are having to cache quite a lot of the data queries (For example searches by keyword) as it's a busy site.

But when a user creates a new data entry, I need to clear all the cached queries (Searches etc..) so the new entry is available in the results.

So in my create, delete and update methods I am calling the following method:

public static void ClearCacheItems()
{
    var enumerator = HttpContext.Current.Cache.GetEnumerator();

    while (enumerator.MoveNext())
    {
        HttpContext.Current.Cache.Remove(enumerator.Key.ToString());
    }
}

Is this really bad? I can't see how else I am supposed to clear the cached items?


问:
Keras: difference of InputLayer and Input
I made a model using Keras with Tensorflow.  I use Inputlayer with these lines of code:

```<code>img1 = tf.placeholder(tf.float32, shape=(None, img_width, img_heigh, img_ch))
first_input = InputLayer(input_tensor=img1, input_shape=(img_width, img_heigh, img_ch))
first_dense = Conv2D(16, 3, 3, activation='relu', border_mode='same', name='1st_conv1')(first_input)
</code>```

But I get this error:

```<code>ValueError: Layer 1st_conv1 was called with an input that isn't a symbolic tensor. Received type: <class 'keras.engine.topology.InputLayer'>. Full input: [<keras.engine.topology.InputLayer object at 0x00000000112170F0>]. All inputs to the layer should be tensors.
</code>```

When I use Input like this, it works fine:

```<code>first_input = Input(tensor=img1, shape=(224, 224, 3), name='1st_input')
first_dense = Conv2D(16, 3, 3, activation='relu', border_mode='same', name='1st_conv1')(first_input)
</code>```

What is the difference between Inputlayer and Input?

答:
According to tensorflow website, "It is generally recommend to use the functional layer API via Input, (which creates an InputLayer) without directly using InputLayer."
Know more at this page here</p>

Body:
I made a model using Keras with Tensorflow.  I use Inputlayer with these lines of code:

img1 = tf.placeholder(tf.float32, shape=(None, img_width, img_heigh, img_ch))
first_input = InputLayer(input_tensor=img1, input_shape=(img_width, img_heigh, img_ch))
first_dense = Conv2D(16, 3, 3, activation='relu', border_mode='same', name='1st_conv1')(first_input)

But I get this error:

ValueError: Layer 1st_conv1 was called with an input that isn't a symbolic tensor. Received type: <class 'keras.engine.topology.InputLayer'>. Full input: [<keras.engine.topology.InputLayer object at 0x00000000112170F0>]. All inputs to the layer should be tensors.

When I use Input like this, it works fine:

first_input = Input(tensor=img1, shape=(224, 224, 3), name='1st_input')
first_dense = Conv2D(16, 3, 3, activation='relu', border_mode='same', name='1st_conv1')(first_input)

What is the difference between Inputlayer and Input?


问:
PyAudio stream_callback unexpected argument
I’m currently developing a little project involving microphone input in Python and I’m using PyAudio library (binding for PortAudio).
As I try the first « Wire » example (blocking), everything work flawlessly, but as soon as I try running the second example, « Wire (callback) », Python says :

```<code>Traceback (most recent call last):
  File "main.py", line 24, in <module>
    stream_callback=callback)
TypeError: __init__() got an unexpected keyword argument 'stream_callback'
</code>```

While it is correctly defined in the binding.
Any help on this ?

The complete code is :

```<code>import pyaudio
import time

WIDTH = 2
CHANNELS = 2
RATE = 44100

p = pyaudio.PyAudio()

def callback(in_data, frame_count, time_info, status):
    return (in_data, pyaudio.paContinue)

stream = p.open(format=p.get_format_from_width(WIDTH),
                channels=CHANNELS,
                rate=RATE,
                input=True,
                output=True,
                stream_callback=callback)

stream.start_stream()

while stream.is_active():
    time.sleep(0.1)

stream.stop_stream()
stream.close()

p.terminate()
</code>```

Thanks !

答: it doesn't look like stream_callback in a valid arg on Mac OSX installations of PyAudio :(</p>

Body:
I’m currently developing a little project involving microphone input in Python and I’m using PyAudio library (binding for PortAudio).
As I try the first « Wire » example (blocking), everything work flawlessly, but as soon as I try running the second example, « Wire (callback) », Python says :

Traceback (most recent call last):
  File "main.py", line 24, in <module>
    stream_callback=callback)
TypeError: __init__() got an unexpected keyword argument 'stream_callback'

While it is correctly defined in the binding.
Any help on this ?

The complete code is :

import pyaudio
import time

WIDTH = 2
CHANNELS = 2
RATE = 44100

p = pyaudio.PyAudio()

def callback(in_data, frame_count, time_info, status):
    return (in_data, pyaudio.paContinue)

stream = p.open(format=p.get_format_from_width(WIDTH),
                channels=CHANNELS,
                rate=RATE,
                input=True,
                output=True,
                stream_callback=callback)

stream.start_stream()

while stream.is_active():
    time.sleep(0.1)

stream.stop_stream()
stream.close()

p.terminate()

Thanks !


问:
SQL Server extract matching string from string
I created a regular expression in JavaScript

```<code>/(E)-(\d)(\d*)-(\d)(\d*)/g
</code>```

Please can someone help me to create the same regular expression in SQL Server?

I have to extract all matching pattern from string

```<code>Enquiry no is (E-4380-01) and E-4380-02 ....
</code>```

Output should be

```<code>(E-4380-01)
E-4380-02
</code>```

答:
SQL Server has not own regex implementation, but you can include System.Text.RegularExpressions.Regex into SQL Server using CLR. SQL would be look like this:

DECLARE @SourceText NVARCHAR(MAX) = N'(E-4380-01) E-4380-02';
DECLARE @RegexPattern NVARCHAR(MAX) = N'(?<number>E-\d+-\d+)';
DECLARE @IsCaseSensitive BIT = 0;

SELECT *
FROM regex.Match(@SourceText, @RegexPattern, @IsCaseSensitive);
```

<p>And result would be:</p>

```+-----------+-----------+------+-----------+---------+---------+
|GroupNumber|IndexNumber|Length|MatchNumber|Value    |GroupName|
+-----------+-----------+------+-----------+---------+---------+
|1          |1          |9     |0          |E-4380-01|number   |
|1          |12         |9     |1          |E-4380-02|number   |
+-----------+-----------+------+-----------+---------+---------+
```

I have wrote it. You can get it on github and use it.

Body:
I created a regular expression in JavaScript

/(E)-(\d)(\d*)-(\d)(\d*)/g

Please can someone help me to create the same regular expression in SQL Server?

I have to extract all matching pattern from string

Enquiry no is (E-4380-01) and E-4380-02 ....

Output should be

(E-4380-01)
E-4380-02

Body:
SQL Server has not own regex implementation, but you can include System.Text.RegularExpressions.Regex into SQL Server using CLR. SQL would be look like this:

DECLARE @SourceText NVARCHAR(MAX) = N'(E-4380-01) E-4380-02';
DECLARE @RegexPattern NVARCHAR(MAX) = N'(?<number>E-\d+-\d+)';
DECLARE @IsCaseSensitive BIT = 0;

SELECT *
FROM regex.Match(@SourceText, @RegexPattern, @IsCaseSensitive);

And result would be:

+-----------+-----------+------+-----------+---------+---------+
|GroupNumber|IndexNumber|Length|MatchNumber|Value    |GroupName|
+-----------+-----------+------+-----------+---------+---------+
|1          |1          |9     |0          |E-4380-01|number   |
|1          |12         |9     |1          |E-4380-02|number   |
+-----------+-----------+------+-----------+---------+---------+

I have wrote it. You can get it on github and use it.


问:
DIV overlaps and anything below that div keeps showing on the div
I am having a DIV which renders fine. Anything below this DIV keeps showing on the DIV (not below the DIV). Need help to resolve this issue. I tried solution provided in other answers related to this but it did resolve my issue.
Issue 1: The TEXT Cham Cham Recipe Description should come after the table ends
Issue 2: The grey div should be on the right in desktop view and below the table in mobile view.I am not able to include complete HTML and CSS due to character limit.

html,body {
  margin: 0;
  font-family: Helvetica, sans-serif;
  background-color: #ffe2ad;
  height: 100%;
}

a {
  color: #000;
}

/* header */

/*mobile*/
@media (min-width: 48em)
{

  .header li {
    float: left;
  }
  .header li a {
    padding: 15px 15px;
  }
  .header .menu {
    clear: none;
    float: right;
    max-height: none;
  }
  .header .menu-icon {
    display: none;
  }
}
/* 48em = 768px @ 16pt font */
/*menu ends here*/

/* Create three unequal columns that floats next to each other for equip*/
* {
  box-sizing: border-box;
}

/* Create three unequal columns that floats next to each other */
.maincolumn {
  float: left;
  padding: 10px;

}

.mainleft, .mainright {
  width: 10%;
}

.mainmiddle {
  width: 80%;

}

/* Clear floats after the columns */
.mainrow:after {
  content: "";
  display: table;
  clear: both;
}

/* disclosure, print and share buttons*/

.discloseshareprintcolumn {
  float: left;
}

.discloseshareprintleft, .discloseshareprintright {
  width: 50%;
}

/* Clear floats after the columns */
.discloseprintrow:after {
  content: "";
  display: table;
  clear: both;
}

.discloseprintcolumn {
  float: left;
  height: 50px; /* Should be removed. Only for demonstration */
}

.discloseprintleft, .discloseprintright {
  width: 50%;
}

/* Clear floats after the columns */
.discloseprintrow:after {
  content: "";
  display: table;
  clear: both;
}

/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
/* For mobile*/
@media only screen and (max-width: 768px) {

  .discloseshareprintcolumn {
    width: 100%;
  }
  .discloseshareprintleft, .discloseshareprintright {
  height: 7%;
}
  .maincolumn {
    width: 100%;
  }
  .mainleft, .mainright {
  height: 20%;
}
}
/* For tablet(IPAD) portrait & landscape*/
@media only screen
  and (min-device-width: 768px)
  and (max-device-width: 1024px)

  {
   .maincolumn {
    width: 100%;
  }

  .discloseshareprintcolumn
  {
    width: 100%;
  }
  .mainleft, .mainright {
  height: 50%;
  width:100%;
}
/*.header li {
    float: left;
  }*/

}

 ```
<pre class="snippet-code-html lang-html prettyprint-override"><code><h2>Three Unequal Columns</h2>

<div class="mainrow">
  <div class="maincolumn mainleft" style="background-color:#aaa;">
   <div class="RecipeTitle" style="text-align:left">
  <h2>Column 3</h2>
    <p>Some text..</p>
</div>
  </div>

  <div class="maincolumn mainmiddle" style="background-color:white;">
   <h1>Cham Cham Recipe|Indian Sweets Recipe|Dessert Recipe</h1>
     <div class="discloseshareprintrow">
     <div class="discloseshareprintcolumn discloseshareprintleft">

     <div class="discloseshareprintcolumn discloseshareprintright">
      <div class="discloseprintrow">
       <div class="discloseprintcolumn discloseprintleft">

        <!--<b>Disclosure:</b> Puchase made via affliate link(s) on this site will earn us commission.-->
        <!--<span style="text-align: left; font-size:x-small;">Advertisement disclosure</span>-->
        </div>
        <div class="discloseprintcolumn discloseprintright">
        <?php include_once("NEWprinter.php");?>
        </div>
        <br>
     </div>

     </div>
   </div>
      </div><h2>Utensils/Items used for cooking</h2>
<div class="toolequip" style="width: 30%; height: 130px; background-color:#ED5E13; float:left; text-align:center; border-bottom: 1px dotted;border-left: 1px dotted;border-color: #BFBFBF; padding-top:15px;"><h3 style="color: white;"> Item name </h3>
 <div style=" height: 30px; background-color:#ED5E13; padding-top: 1px; border-top: 1px dotted;border-bottom: 1px dotted;border-left: 1px dotted;border-color: #BFBFBF; text-align:center; padding-top:5px;font-size:small;"> Wooden spetula </div>
 <div style="height: 30px; background-color:#ED5E13; border-bottom: 1px dotted;border-left: 1px dotted;border-color: #BFBFBF; text-align:center;padding-top:5px;font-size:small;"> Pot </div>
 <div style="height: 30px; background-color:#ED5E13; border-bottom: 1px dotted;border-left: 1px dotted;border-color: #BFBFBF; text-align:center;padding-top:5px; font-size:small;"> Pressure cooker </div>
 <div style="height: 30px; background-color:#ED5E13; border-bottom: 1px dotted;border-left: 1px dotted;border-color: #BFBFBF; text-align:center;padding-top:5px; font-size:small;"> Stainless steel bowl </div>
 <div style="height: 30px; background-color:#ED5E13; border-bottom: 1px dotted;border-left: 1px dotted;border-color: #BFBFBF; text-align:center;padding-top:5px; font-size:small;"> Butter knife </div>
 <div style="height: 30px; background-color:#ED5E13; border-bottom: 1px dotted;border-left: 1px dotted;border-color: #BFBFBF; text-align:center;padding-top:5px; font-size:small;"> Measuring cup </div>
 <div style="height: 30px; background-color:#ED5E13; border-bottom: 1px dotted;border-left: 1px dotted;border-color: #BFBFBF; text-align:center;padding-top:5px; font-size:small;"> Long serving plate </div>
 <div style="height: 30px; background-color:#ED5E13; border-bottom: 1px dotted;border-left: 1px dotted;border-color: #BFBFBF; text-align:center;padding-top:5px; font-size:small;"> Pestel & Mortar </div>
 <div style="height: 30px; background-color:#ED5E13; border-bottom: 1px dotted;border-left: 1px dotted;border-color: #BFBFBF; text-align:center;padding-top:5px; font-size:small;"> Knife </div>
 <div style="height: 30px; background-color:#ED5E13; border-bottom: 1px dotted;border-left: 1px dotted;border-color: #BFBFBF; text-align:center;padding-top:5px; font-size:small;"> Spoon </div>
 <div style="height: 30px; background-color:#ED5E13; border-bottom: 1px dotted;border-left: 1px dotted;border-color: #BFBFBF; text-align:center;padding-top:5px; font-size:small;"> Small bowl </div>
 <div style="height: 30px; background-color:#ED5E13; border-bottom: 1px dotted;border-left: 1px dotted;border-color: #BFBFBF; text-align:center;padding-top:5px; font-size:small;"> Strainer </div>
 <div style="height: 30px; background-color:#ED5E13; border-bottom: 1px dotted;border-left: 1px dotted;border-color: #BFBFBF; text-align:center;padding-top:5px; font-size:small;clear:both;"> Muslin cloth </div>
 </div>
    <div class="toolequip" style="width: 70%; height: 130px; background-color:#ED5E13; float:right; text-align:center; border-bottom: 1px dotted;border-left: 1px dotted; dotted;border-right: 1px dotted; border-color: #BFBFBF;  padding-top:15px;"><h3 style="color: white;"> See options, price & availability </h3>
 <div style="background-color:#ED5E13; border-top: 1px dotted;border-bottom: 1px dotted;border-left: 1px dotted;border-color: #BFBFBF; text-align:center; ">
     <div id="vendors">
      <div id="left" class="col" style="box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:white; color: black;border-right: 1px dotted; border-bottom: 1px dotted;border-color: #BFBFBF; padding-top:5px;cursor:pointer;"><i class="fab fa-amazon"></i><b>Amazon</b></div>
      <div id="center" class="col" style="box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:red; color: white;border-right: 1px dotted;border-bottom: 1px dotted;border-color: #BFBFBF;padding-top:5px;cursor:pointer;"><i class="fas fa-bullseye"></i> <b>Target</b></div>
      <div id="right" class="col" style="box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:#041E42; color: white;border-bottom: 1px dotted;border-color: #BFBFBF;padding-top:5px;cursor:pointer;"><b>Walmart</b></div>
     </div>

 </div>
 <div style="background-color:#ED5E13; border-bottom: 1px dotted;border-left: 1px dotted;border-color: #BFBFBF; text-align:center;">
   <div id="vendors">
      <div id="left" class="col" style=" box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:white; color: black;border-right: 1px dotted; border-bottom: 1px dotted;border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><i class="fab fa-amazon"></i><b>Amazon</b></div>
      <div id="center" class="col" style="box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:red; color: white; border-bottom: 1px dotted;border-right: 1px dotted;border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><i class="fas fa-bullseye"></i> <b>Target</b></div>
      <div id="right" class="col" style="box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:#041E42; color: white; border-bottom: 1px dotted;border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><b>Walmart</b></div>
     </div></div>
 <div style="background-color:#ED5E13; border-bottom: 1px dotted;border-left: 1px dotted;border-color: #BFBFBF; text-align:center;">
   <div id="vendors">
      <div id="left" class="col" style=" box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:white; color: black;border-right: 1px dotted; border-bottom: 1px dotted; border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><i class="fab fa-amazon"></i><b>Amazon</b></div>
      <div id="center" class="col" style="box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:red; color: white;white;border-right: 1px dotted;  border-bottom: 1px dotted;border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><i class="fas fa-bullseye"></i> <b>Target</b></div>
      <div id="right" class="col" style="box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:#041E42; color: white;border-bottom: 1px dotted;border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><b>Walmart</b></div>
     </div></div>
     <div style="background-color:#ED5E13; border-bottom: 1px dotted;border-left: 1px dotted;border-color: #BFBFBF; text-align:center;">
   <div id="vendors">
      <div id="left" class="col" style=" box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:white; color: black;border-right: 1px dotted; border-bottom: 1px dotted; border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><i class="fab fa-amazon"></i><b>Amazon</b></div>
      <div id="center" class="col" style="box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:red; color: white;white;border-right: 1px dotted;  border-bottom: 1px dotted;border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><i class="fas fa-bullseye"></i> <b>Target</b></div>
      <div id="right" class="col" style="box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:#041E42; color: white;border-bottom: 1px dotted;border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><b>Walmart</b></div>
     </div></div>
     <div style="background-color:#ED5E13; border-bottom: 1px dotted;border-left: 1px dotted;border-color: #BFBFBF; text-align:center;">
   <div id="vendors">
      <div id="left" class="col" style=" box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:white; color: black;border-right: 1px dotted; border-bottom: 1px dotted; border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><i class="fab fa-amazon"></i><b>Amazon</b></div>
      <div id="center" class="col" style="box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:red; color: white;white;border-right: 1px dotted;  border-bottom: 1px dotted;border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><i class="fas fa-bullseye"></i> <b>Target</b></div>
      <div id="right" class="col" style="box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:#041E42; color: white;border-bottom: 1px dotted;border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><b>Walmart</b></div>
     </div></div>
     <div style="background-color:#ED5E13; border-bottom: 1px dotted;border-left: 1px dotted;border-color: #BFBFBF; text-align:center;">
   <div id="vendors">
      <div id="left" class="col" style=" box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:white; color: black;border-right: 1px dotted; border-bottom: 1px dotted; border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><i class="fab fa-amazon"></i><b>Amazon</b></div>
      <div id="center" class="col" style="box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:red; color: white;white;border-right: 1px dotted;  border-bottom: 1px dotted;border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><i class="fas fa-bullseye"></i> <b>Target</b></div>
      <div id="right" class="col" style="box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:#041E42; color: white;border-bottom: 1px dotted;border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><b>Walmart</b></div>
     </div></div>
     <div style="background-color:#ED5E13; border-bottom: 1px dotted;border-left: 1px dotted;border-color: #BFBFBF; text-align:center;">
   <div id="vendors">
      <div id="left" class="col" style=" box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:white; color: black;border-right: 1px dotted; border-bottom: 1px dotted; border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><i class="fab fa-amazon"></i><b>Amazon</b></div>
      <div id="center" class="col" style="box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:red; color: white;white;border-right: 1px dotted;  border-bottom: 1px dotted;border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><i class="fas fa-bullseye"></i> <b>Target</b></div>
      <div id="right" class="col" style="box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:#041E42; color: white;border-bottom: 1px dotted;border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><b>Walmart</b></div>
     </div></div>
     <div style="background-color:#ED5E13; border-bottom: 1px dotted;border-left: 1px dotted;border-color: #BFBFBF; text-align:center;">
   <div id="vendors">
      <div id="left" class="col" style=" box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:white; color: black;border-right: 1px dotted; border-bottom: 1px dotted; border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><i class="fab fa-amazon"></i><b>Amazon</b></div>
      <div id="center" class="col" style="box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:red; color: white;white;border-right: 1px dotted;  border-bottom: 1px dotted;border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><i class="fas fa-bullseye"></i> <b>Target</b></div>
      <div id="right" class="col" style="box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:#041E42; color: white;border-bottom: 1px dotted;border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><b>Walmart</b></div>
     </div></div>
     <div style="background-color:#ED5E13; border-bottom: 1px dotted;border-left: 1px dotted;border-color: #BFBFBF; text-align:center;">
   <div id="vendors">
      <div id="left" class="col" style=" box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:white; color: black;border-right: 1px dotted; border-bottom: 1px dotted; border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><i class="fab fa-amazon"></i><b>Amazon</b></div>
      <div id="center" class="col" style="box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:red; color: white;white;border-right: 1px dotted;  border-bottom: 1px dotted;border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><i class="fas fa-bullseye"></i> <b>Target</b></div>
      <div id="right" class="col" style="box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:#041E42; color: white;border-bottom: 1px dotted;border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><b>Walmart</b></div>
     </div></div>
     <div style="background-color:#ED5E13; border-bottom: 1px dotted;border-left: 1px dotted;border-color: #BFBFBF; text-align:center;">
   <div id="vendors">
      <div id="left" class="col" style=" box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:white; color: black;border-right: 1px dotted; border-bottom: 1px dotted; border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><i class="fab fa-amazon"></i><b>Amazon</b></div>
      <div id="center" class="col" style="box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:red; color: white;white;border-right: 1px dotted;  border-bottom: 1px dotted;border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><i class="fas fa-bullseye"></i> <b>Target</b></div>
      <div id="right" class="col" style="box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:#041E42; color: white;border-bottom: 1px dotted;border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><b>Walmart</b></div>
     </div></div>
     <div style="background-color:#ED5E13; border-bottom: 1px dotted;border-left: 1px dotted;border-color: #BFBFBF; text-align:center;">
   <div id="vendors">
      <div id="left" class="col" style=" box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:white; color: black;border-right: 1px dotted; border-bottom: 1px dotted; border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><i class="fab fa-amazon"></i><b>Amazon</b></div>
      <div id="center" class="col" style="box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:red; color: white;white;border-right: 1px dotted;  border-bottom: 1px dotted;border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><i class="fas fa-bullseye"></i> <b>Target</b></div>
      <div id="right" class="col" style="box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:#041E42; color: white;border-bottom: 1px dotted;border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><b>Walmart</b></div>
     </div></div>
     <div style="background-color:#ED5E13; border-bottom: 1px dotted;border-left: 1px dotted;border-color: #BFBFBF; text-align:center;">
   <div id="vendors">
      <div id="left" class="col" style=" box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:white; color: black;border-right: 1px dotted; border-bottom: 1px dotted; border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><i class="fab fa-amazon"></i><b>Amazon</b></div>
      <div id="center" class="col" style="box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:red; color: white;white;border-right: 1px dotted;  border-bottom: 1px dotted;border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><i class="fas fa-bullseye"></i> <b>Target</b></div>
      <div id="right" class="col" style="box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:#041E42; color: white;border-bottom: 1px dotted;border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><b>Walmart</b></div>
     </div></div>
     <div style="background-color:#ED5E13; border-bottom: 1px dotted;border-left: 1px dotted;border-color: #BFBFBF; text-align:center;">
   <div id="vendors">
      <div id="left" class="col" style=" box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:white; color: black;border-right: 1px dotted; border-bottom: 1px dotted; border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><i class="fab fa-amazon"></i><b>Amazon</b></div>
      <div id="center" class="col" style="box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:red; color: white;white;border-right: 1px dotted;  border-bottom: 1px dotted;border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><i class="fas fa-bullseye"></i> <b>Target</b></div>
      <div id="right" class="col" style="box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); transition: background-color 0.3s ease-in-out;height: 30px;background-color:#041E42; color: white;border-bottom: 1px dotted;border-color: #BFBFBF;cursor:pointer;padding-top:5px;"><b>Walmart</b></div>
     </div></div>
 </div>

  <h2 style="text-align:left">Cham Cham Recipe Description</h2>
  </div> <!--end of maincolumn mainmiddle-->
  <div class="maincolumn mainright" style="background-color:#ccc;">
    <h2>Column 3</h2>
    <p>Some text..</p>
  </div>
</div></code>```

答: I think that's because you have written it inside the div</p>

Body:
I am having a DIV which renders fine. Anything below this DIV keeps showing on the DIV (not below the DIV). Need help to resolve this issue. I tried solution provided in other answers related to this but it did resolve my issue.
Issue 1: The TEXT Cham Cham Recipe Description should come after the table ends
Issue 2: The grey div should be on the right in desktop view and below the table in mobile view.I am not able to include complete HTML and CSS due to character limit.

html,body {
  margin: 0;
  font-family: Helvetica, sans-serif;
  background-color: #ffe2ad;
  height: 100%;
}

a {
  color: #000;
}

/* header */

/*mobile*/
@media (min-width: 48em)
{

  .header li {
    float: left;
  }
  .header li a {
    padding: 15px 15px;
  }
  .header .menu {
    clear: none;
    float: right;
    max-height: none;
  }
  .header .menu-icon {
    display: none;
  }
}
/* 48em = 768px @ 16pt font */
/*menu ends here*/

/* Create three unequal columns that floats next to each other for equip*/
* {
  box-sizing: border-box;
}

/* Create three unequal columns that floats next to each other */
.maincolumn {
  float: left;
  padding: 10px;

}

.mainleft, .mainright {
  width: 10%;
}

.mainmiddle {
  width: 80%;

}

/* Clear floats after the columns */
.mainrow:after {
  content: "";
  display: table;
  clear: both;
}

/* disclosure, print and share buttons*/

.discloseshareprintcolumn {
  float: left;
}

.discloseshareprintleft, .discloseshareprintright {
  width: 50%;
}

/* Clear floats after the columns */
.discloseprintrow:after {
  content: "";
  display: table;
  clear: both;
}

.discloseprintcolumn {
  float: left;
  height: 50px; /* Should be removed. Only for demonstration */
}

.discloseprintleft, .discloseprintright {
  width: 50%;
}

/* Clear floats after the columns */
.discloseprintrow:after {
  content: "";
  display: table;
  clear: both;
}

/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
/* For mobile*/
@media only screen and (max-width: 768px) {

  .discloseshareprintcolumn {
    width: 100%;
  }
  .discloseshareprintleft, .discloseshareprintright {
  height: 7%;
}
  .maincolumn {
    width: 100%;
  }
  .mainleft, .mainright {
  height: 20%;
}
}
/* For tablet(IPAD) portrait & landscape*/
@media only screen
  and (min-device-width: 768px)
  and (max-device-width: 1024px)

  {
   .maincolumn {
    width: 100%;
  }

  .discloseshareprintcolumn
  {
    width: 100%;
  }
  .mainleft, .mainright {
  height: 50%;
  width:100%;
}
/*.header li {
    float: left;
  }*/

}

Three Unequal Columns

Column 3

Some text..

Cham Cham Recipe|Indian Sweets Recipe|Dessert Recipe

        <?php include_once("NEWprinter.php");?>

Utensils/Items used for cooking

 Item name

 Wooden spetula

 Pot

 Pressure cooker

 Stainless steel bowl

 Butter knife

 Measuring cup

 Long serving plate

 Pestel & Mortar

 Knife

 Spoon

 Small bowl

 Strainer

 Muslin cloth

 See options, price & availability

Amazon

 Target

Walmart

Amazon

 Target

Walmart

Amazon

 Target

Walmart

Amazon

 Target

Walmart

Amazon

 Target

Walmart

Amazon

 Target

Walmart

Amazon

 Target

Walmart

Amazon

 Target

Walmart

Amazon

 Target

Walmart

Amazon

 Target

Walmart

Amazon

 Target

Walmart

Amazon

 Target

Walmart

Amazon

 Target

Walmart

Cham Cham Recipe Description

Column 3

Some text..


问:
what does __asm__("movl %eax,%esp") return?
here is a little function on a old book:

```<code>unsigned long f()
{
   __asm__("movl %eax,%esp");
}
</code>```

the function explained to get the stack point,but it seems not.It actually gets a 8-bit address much lower than my frame address.I guess it's designed for 32-bit system?
Please forgive me if I said something stupid.

答:
Actually the code has some mistake

```<code>unsigned long f()
{
__asm__("movl %esp,%eax");
}
</code>```

it provides the stack pointer address

Body:
here is a little function on a old book:

unsigned long f()
{
   __asm__("movl %eax,%esp");
}

the function explained to get the stack point,but it seems not.It actually gets a 8-bit address much lower than my frame address.I guess it's designed for 32-bit system?
Please forgive me if I said something stupid.

Body:
Actually the code has some mistake

unsigned long f()
{
__asm__("movl %esp,%eax");
}

it provides the stack pointer address


问:
shapefile bounding box not set correctly via rest api geoserver
Hi According to this  question  i write methods to Add Store and ShapeFile to Geoserver , that work correctly but when get preview of layer said  bbox is incorrect

illegal bbox, minX: 0.0 is greater than maxX: -1.0

after add shapefile when i change manually from geoserver web interface its work properly but i i wanna programmatically
this is my code

```<code> public bool UploadShapeFile()
    {

        var uploads = Path.Combine(_host.WebRootPath, "Upload");
        var filePath = Path.Combine(uploads, "states_25.zip");
        string result = Path.GetFileNameWithoutExtension(filePath);
        String fileUri = filePath;
        Console.Write(fileUri);

        byte[] localShapeFile = readLocalShapeFile(fileUri);

        String sUrl = "http://192.168.1.2:8080/geoserver/rest/workspaces" +
            "/sf/datastores/sf3/file.shp";

        WebRequest request = WebRequest.Create(sUrl);

        request.ContentType = "application/zip";
        request.Method = "PUT";
        request.Credentials = new NetworkCredential("admin", "geoserver");

        Stream requestStream = request.GetRequestStream();
        requestStream.Write(localShapeFile, 0, localShapeFile.Length);
        requestStream.Close();

        WebResponse response = request.GetResponse();
        CreatePostGISTableAndFeatureType();
        return true;
    }

    public bool CreatePostGISTableAndFeatureType()
    {
        string featXml = GetXml();
        string fUrl =   "http://192.168.1.2:8080/geoserver/rest/workspaces" +
            "/sf/datastores/sf3/featuretypes";

        WebRequest request = WebRequest.Create(fUrl);
        request.Method = "POST";
        request.ContentType = "application/xml";
        request.Credentials = new NetworkCredential("admin", "geoserver");

        byte[] buffer = Encoding.GetEncoding("UTF-8").GetBytes(featXml);

        Stream requestStream = request.GetRequestStream();
        requestStream.Write(buffer, 0, buffer.Length);
        requestStream.Close();
        try
        {
            WebResponse response = request.GetResponse();
        }
        catch (Exception ee)
        {

        }

        return false;
    }
    private string GetXml()
    {
        string fXml = "<featureType>" +
                        "<name>sepp</name>" +
                        "<nativeName>sepp</nativeName>" +
                        "<title>sepp</title>" +
                        "<srs>EPSG:4326</srs>" +
                        "<attributes>" +
                            "<attribute>" +
                                "<name>the_geom</name>" +
                                "<binding>com.vividsolutions.jts.geom.Point</binding>" +
                            "</attribute>" +
                            "<attribute>" +
                                "<name>description</name>" +
                                "<binding>java.lang.String</binding>" +
                            "</attribute>" +
                            "<attribute>" +
                                "<name>timestamp</name>" +
                                "<binding>java.util.Date</binding>" +
                            "</attribute>" +
                        "</attributes>" +
                    "</featureType>";
        return fXml;
    }

    private byte[] readLocalShapeFile(string filePath)
    {
        byte[] buffer;
        FileStream fStream = new FileStream(filePath, FileMode.Open, FileAccess.Read);
        try
        {
            int length = (int)fStream.Length;
            buffer = new byte[length];
            int count;
            int sum = 0;

            while ((count = fStream.Read(buffer, sum, length - sum)) > 0)
                sum += count;
        }
        finally
        {
            fStream.Close();
        }

        return buffer;
    }
</code>```

Thank you so much in advance for your attention

答:
You need to either specify the bounding box of your data set in the XML file you PUT to the server or include the recalculate option to the request.

See the REST Manual for full details:

recalculate array string

Specifies whether to recalculate any bounding boxes for a feature type. Some properties of feature types are automatically recalculated when necessary. In particular, the native bounding box is recalculated when the projection or projection policy are changed, and the lat/lon bounding box is recalculated when the native bounding box is recalculated, or when a new native bounding box is explicitly provided in the request. (The native and lat/lon bounding boxes are not automatically recalculated when they are explicitly included in the request.) In addition, the client may explicitly request a fixed set of fields to calculate, by including a comma-separated list of their names in the recalculate parameter. The empty parameter ‘recalculate=’ is useful avoid slow recalculation when operating against large datasets as ‘recalculate=’ avoids calculating any fields, regardless of any changes to projection, projection policy, etc. The nativebbox parameter ‘recalculate=nativebbox’ is used recalculates the native bounding box, while avoiding recalculating the lat/lon bounding box. Recalculate parameters can be used in together - ‘recalculate=nativebbox,latlonbbox’ can be used after a bulk import to to recalculates both the native bounding box and the lat/lon bounding box.

Body:
Hi According to this  question  i write methods to Add Store and ShapeFile to Geoserver , that work correctly but when get preview of layer said  bbox is incorrect

illegal bbox, minX: 0.0 is greater than maxX: -1.0

after add shapefile when i change manually from geoserver web interface its work properly but i i wanna programmatically
this is my code

 public bool UploadShapeFile()
    {

        var uploads = Path.Combine(_host.WebRootPath, "Upload");
        var filePath = Path.Combine(uploads, "states_25.zip");
        string result = Path.GetFileNameWithoutExtension(filePath);
        String fileUri = filePath;
        Console.Write(fileUri);

        byte[] localShapeFile = readLocalShapeFile(fileUri);

        String sUrl = "http://192.168.1.2:8080/geoserver/rest/workspaces" +
            "/sf/datastores/sf3/file.shp";

        WebRequest request = WebRequest.Create(sUrl);

        request.ContentType = "application/zip";
        request.Method = "PUT";
        request.Credentials = new NetworkCredential("admin", "geoserver");

        Stream requestStream = request.GetRequestStream();
        requestStream.Write(localShapeFile, 0, localShapeFile.Length);
        requestStream.Close();

        WebResponse response = request.GetResponse();
        CreatePostGISTableAndFeatureType();
        return true;
    }

    public bool CreatePostGISTableAndFeatureType()
    {
        string featXml = GetXml();
        string fUrl =   "http://192.168.1.2:8080/geoserver/rest/workspaces" +
            "/sf/datastores/sf3/featuretypes";

        WebRequest request = WebRequest.Create(fUrl);
        request.Method = "POST";
        request.ContentType = "application/xml";
        request.Credentials = new NetworkCredential("admin", "geoserver");

        byte[] buffer = Encoding.GetEncoding("UTF-8").GetBytes(featXml);

        Stream requestStream = request.GetRequestStream();
        requestStream.Write(buffer, 0, buffer.Length);
        requestStream.Close();
        try
        {
            WebResponse response = request.GetResponse();
        }
        catch (Exception ee)
        {

        }

        return false;
    }
    private string GetXml()
    {
        string fXml = "<featureType>" +
                        "<name>sepp</name>" +
                        "<nativeName>sepp</nativeName>" +
                        "<title>sepp</title>" +
                        "<srs>EPSG:4326</srs>" +
                        "<attributes>" +
                            "<attribute>" +
                                "<name>the_geom</name>" +
                                "<binding>com.vividsolutions.jts.geom.Point</binding>" +
                            "</attribute>" +
                            "<attribute>" +
                                "<name>description</name>" +
                                "<binding>java.lang.String</binding>" +
                            "</attribute>" +
                            "<attribute>" +
                                "<name>timestamp</name>" +
                                "<binding>java.util.Date</binding>" +
                            "</attribute>" +
                        "</attributes>" +
                    "</featureType>";
        return fXml;
    }

    private byte[] readLocalShapeFile(string filePath)
    {
        byte[] buffer;
        FileStream fStream = new FileStream(filePath, FileMode.Open, FileAccess.Read);
        try
        {
            int length = (int)fStream.Length;
            buffer = new byte[length];
            int count;
            int sum = 0;

            while ((count = fStream.Read(buffer, sum, length - sum)) > 0)
                sum += count;
        }
        finally
        {
            fStream.Close();
        }

        return buffer;
    }

Thank you so much in advance for your attention


问:
Effective use of a DLL
Up until now I've only used DLL's as a source for plugins in my applications.

But I know that using DLL's will allow me to update my program "client side" a lot easier the re-downloading the main EXE all time.

The problem is, I cant seem to find an effective way to use dll's in my application, or to use them in a way that would impact the program, but not force me to change the way the entire program works.

The "application" in this instance is an XNA Game.

So for example, I have three main classes (excluding the main game Class)

Units
Players
Networking.

I would like to have the Units/Players in one DLL, and the Networking in another DLL, or at least move the networking to a separate DLL, But the way the networking class works and is coded would require the DLL to have a reference to the Game, and the Game to have a reference to the DLL, which is prevented in Visual Studio to prevent circular dependencies.

My question, is how can I effectively use a DLL to store my networking class, I have a couple of ideas, but I'm not sure how feasible any of them is yet.

What I would like, if possible, would be to have the entire networking instance running from the dll, sending receiving, and updating the game data as needed.

But so far I have only been able to come up with a way to have the receiving and sending in the Main game.exe and move the handling functions into the dll, and even then, the handling functions cannot (easily) communicate with the game.

I also thought of using the Plugin System, but that requires me to use Delegates for all my functions that I want to use in the Networking DLL, and seems very inefficient in the long run.

If this sort of thing cant be done with DLL's (back and forth communication between the Host program and dll), then what use are they anyway?

Sure I can have simple functions, like my "Color" class, to parse and return color codes, but simple things aren't going to change, and need to be updated.

Anyway, I always tend to ramble about things that don't matter (for the most part), so thanks for taking a look, and for any responses :)

答:
Usually DLLs are just a product of having more projects in a solution.

So the question you are asking is:

"Why and how would I have more projects in my solution?"

It boils down to organization of source code.

In OOP objects usually can be grouped into smaller domains that can be described by themselves and work as a black-box.

These blackboxes are DLLs.

In a game I can think of a few separate projects:

base classes

game logic

renderer

serialization/deserialization (save manager)

audio manager

code utilities ...

So if you can organize your code to work in that way you can have DLLs.

You can't have them without reorganizing what you have.

If the APP is coded in a very monolithic way then you could have troubles in separating logical domains of code.

Title: Effective use of a DLL


问:
How to set Material-UI icon for a form field ReactJS
I need to know how can I set an icon in front of the select field. I have already done this for TextField as below

```<code><TextField
id="input-with-icon-textfield"
label="Env.Satisfaction"
InputProps={{
    startAdornment: (
    <InputAdornment position="start">
        <SentimentSatisfied />
    </InputAdornment>
    ),
}}
/>
</code>```

But I tried this with select and it didn't work:

```<code><Select
labelId="demo-simple-select-label"
id="demo-simple-select"
value={age}
onChange={handleChange}
InputProps={{
    startAdornment: (
        <InputAdornment position="start">
        <SupervisedUserCircle />
        </InputAdornment>
    ),
    }}
>
<MenuItem value={10}>Ten</MenuItem>
<MenuItem value={20}>Twenty</MenuItem>
<MenuItem value={30}>Thirty</MenuItem>
</Select>
</code>```

Can someone please help me?

This is how it looks in a TextField, I want to do this for Select as well.

TextField

答:
You can use two approaches,

First one is using the Select component

```<code><Select
   labelId="demo-simple-select-label"
   id="demo-simple-select"
   value={currency}
   onChange={handleChange}
   startAdornment={
    <InputAdornment position="start">
      <AccountCircle />
    </InputAdornment>
    }
   >
  {currencies.map(option => (
    <MenuItem key={option.value} value={option.value}>
       {option.label}
    </MenuItem>
  ))}
</Select>
</code>```

the second approach is using the Text field,

```<code><TextField
  id="standard-select-currency"
  select
  label="Select"
  value={currency}
  onChange={handleChange}
  helperText="Please select your currency"
  InputProps={{
    startAdornment: (
      <InputAdornment position="start">
         <AccountCircle />
      </InputAdornment>
     )
  }}
  >
   {currencies.map(option => (
     <MenuItem key={option.value} value={option.value}>
      {option.label}
     </MenuItem>
   ))}
</TextField>
</code>```

find a working example I created here: https://codesandbox.io/s/material-demo-8qxtv

Body:
I need to know how can I set an icon in front of the select field. I have already done this for TextField as below

<TextField
id="input-with-icon-textfield"
label="Env.Satisfaction"
InputProps={{
    startAdornment: (
    <InputAdornment position="start">
        <SentimentSatisfied />
    </InputAdornment>
    ),
}}
/>

But I tried this with select and it didn't work:

<Select
labelId="demo-simple-select-label"
id="demo-simple-select"
value={age}
onChange={handleChange}
InputProps={{
    startAdornment: (
        <InputAdornment position="start">
        <SupervisedUserCircle />
        </InputAdornment>
    ),
    }}
>
<MenuItem value={10}>Ten</MenuItem>
<MenuItem value={20}>Twenty</MenuItem>
<MenuItem value={30}>Thirty</MenuItem>
</Select>

Can someone please help me?

This is how it looks in a TextField, I want to do this for Select as well.

TextField

Body:
You can use two approaches,

First one is using the Select component

<Select
   labelId="demo-simple-select-label"
   id="demo-simple-select"
   value={currency}
   onChange={handleChange}
   startAdornment={
    <InputAdornment position="start">
      <AccountCircle />
    </InputAdornment>
    }
   >
  {currencies.map(option => (
    <MenuItem key={option.value} value={option.value}>
       {option.label}
    </MenuItem>
  ))}
</Select>

the second approach is using the Text field,

<TextField
  id="standard-select-currency"
  select
  label="Select"
  value={currency}
  onChange={handleChange}
  helperText="Please select your currency"
  InputProps={{
    startAdornment: (
      <InputAdornment position="start">
         <AccountCircle />
      </InputAdornment>
     )
  }}
  >
   {currencies.map(option => (
     <MenuItem key={option.value} value={option.value}>
      {option.label}
     </MenuItem>
   ))}
</TextField>

find a working example I created here: https://codesandbox.io/s/material-demo-8qxtv


问:
How to select values from two table in a single query
i want to fetch data from two table simultaneously from mysql database but i cant use join since the query has other parameter that needs to be considered.
here is my query

```<code>SELECT *
from `c_detail`
where `c_id` in  (SELECT `job_c_id`
                  from `applied_jobs`
                  where `applied_f_id` IN (SELECT `f_detail_id`
                                           from `f_detail`
                                           WHERE `f_email` = '{$_SESSION['f_email']}'
                                          )
                 )
</code>```

here i want to select a column of table applied_jobs.
Can we do this in the same query above?

答:
    SELECT *
    FROM `c_detail`, `c_dtl`
    JOIN `applied_jobs`.`jobs` ON `c_dtl`.`c_id` = `jobs`.`job_c_id`
    JOIN  `f_detail`.`f_dtl` ON `jobs`.`applied_f_id` = `f_dtl`.`f_detail_id`
    WHERE `f_email` = '{$_SESSION['f_email']}'
```

You can use applied_jobs column using alias

Body:
i want to fetch data from two table simultaneously from mysql database but i cant use join since the query has other parameter that needs to be considered.
here is my query

SELECT *
from `c_detail`
where `c_id` in  (SELECT `job_c_id`
                  from `applied_jobs`
                  where `applied_f_id` IN (SELECT `f_detail_id`
                                           from `f_detail`
                                           WHERE `f_email` = '{$_SESSION['f_email']}'
                                          )
                 )

here i want to select a column of table applied_jobs.
Can we do this in the same query above?

Body:
    SELECT *
    FROM `c_detail`, `c_dtl`
    JOIN `applied_jobs`.`jobs` ON `c_dtl`.`c_id` = `jobs`.`job_c_id`
    JOIN  `f_detail`.`f_dtl` ON `jobs`.`applied_f_id` = `f_dtl`.`f_detail_id`
    WHERE `f_email` = '{$_SESSION['f_email']}'

You can use applied_jobs column using alias